IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

HTML Discussion :

Je commence à CODER mon site


Sujet :

HTML

  1. #1
    Membre confirmé
    Profil pro
    Inscrit en
    Mai 2006
    Messages
    199
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Mai 2006
    Messages : 199
    Par défaut Je commence à CODER mon site
    Bonjour à tous !
    J'ai besoin d'un renseignement.
    Je vais commencer à coder mon site. Et je crée ce topic, pour ne pas en créer plusieurs. Donc tout ce qui se rapportera à l'aide concernant mon site, je le mettrai ici.
    D'abord je voudrai savoir quels sont les points ou je dois tout mettre à 0, c'est à dire au même niveau dans un fichier CSS.
    Par exemple :
    *
    {
    margin: 0;
    padding: 0;
    border: 0;
    font-family: Verdana, Arial, serif, sans-serif;
    font-size: 1em;
    font-weight: normal;
    font-style: normal;
    text-decoration: none;
    text-align: justify;
    }
    Est ce que c'est une bonne idée de commencer un fichier CSS par çà ?

    -Est ce que vous pouvez me confirmez que le code qui permet par exemple de centrer le corps d'un design est celui là :
    body
    {
    margin: auto
    margin-top: 0px;
    margin-bottom: 0px;
    text-align: justify;
    }
    vace ce codage là, le site est il extensible ?

    Merci.

  2. #2
    Membre Expert Avatar de Erwan31
    Profil pro
    Inscrit en
    Février 2008
    Messages
    2 177
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Février 2008
    Messages : 2 177
    Par défaut
    Citation Envoyé par °°° Zen-Spirit °°° Voir le message
    Est ce que c'est une bonne idée de commencer un fichier CSS par çà ?
    Non pas de façon aussi radical, ce type de reset est à éviter. Les styles par default du navigateurs sont là pour assurer un minimum de présentation en l'absence de ta css (styles auteurs).
    Vouloir TOUT annuler est donc absurde et peut s'avérer problématique...
    D'autre part cela implique de tout redéfinir par la suite (marges Hn, font-size, font-weight...) sans rien oublier.

    Mieux vaut annuler certains style par default en connaissance de cause (pour éviter par exemple de trop grandes différences de marges/padding entre navigateurs) et de manière ciblé avec des reset de ce type (exemple non exhaustif) :

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    ul,ol,form,body,fieldset {margin:0; padding:0;}
    li { list-style:none;}
    a img { border:none;}
    Mais ce n'est qu'un exemple parmi d'autres qui devra dépendre de prises de décisions bien mesurées.


    Citation Envoyé par °°° Zen-Spirit °°° Voir le message
    Est ce que vous pouvez me confirmez que le code qui permet par exemple de centrer le corps d'un design est celui là :
    vace ce codage là, le site est il extensible ?
    Non les marge auto latérales doivent être appliquées au div conteneur globale ou aux divs enfant directes (directement imbriqués) de body.

  3. #3
    Nouveau membre du Club
    Profil pro
    Inscrit en
    Août 2004
    Messages
    9
    Détails du profil
    Informations personnelles :
    Localisation : Suisse

    Informations forums :
    Inscription : Août 2004
    Messages : 9
    Par défaut
    Citation Envoyé par Erwan31 Voir le message
    Non pas de façon aussi radical, ce type de reset est à éviter. Les styles par default du navigateurs sont là pour assurer un minimum de présentation en l'absence de ta css (styles auteurs).
    Vouloir TOUT annuler est donc absurde et peut s'avérer problématique...
    D'autre part cela implique de tout redéfinir par la suite (marges Hn, font-size, font-weight...) sans rien oublier.
    Hum, je ne serais pas aussi catégorique qu'Erwan sauf si on maitrise bien les valeurs par défaut des éléments. Sans cette bonne connaissance, on est confronté à des décalages lors de mises en page. Et les styles par défaut ne sont de loin pas identiques pour chaque navigateur et versions de navigateur. Moi, par expérience, j'ai préféré mettre mes margin et padding à zéro et redéfinir mes propriétés en fonction de mes besoins. C'est mon choix
    Niklaus

  4. #4
    Membre confirmé
    Profil pro
    Inscrit en
    Mai 2006
    Messages
    199
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Mai 2006
    Messages : 199
    Par défaut
    Merci à vous pour vos précisions ! Je comprends mieux.
    Je suis entrain de constituer le corps de ma page html. J'ai un petit soucis.
    Dans le corps il y a 3 parties, genre 3 box afin de mettre des infos dans ces 3 box, comme sur ce site là :Exemple ici.
    Vous pouvez voir que dans le corps de leur site, il y a une partie blanche que j'appelle box-photo ( où il y a la la photo du joueur de foot et c'est écrit "A la une du mercredi 02 avril"), le 2ème box, c'est la partie noire où c'est écrit "ALL PSG TV" et la dernière partie c'est un autre box que j'appelle box info rouge, c'est là où c'est écrit "priez ..."
    Le problème c'est ce dernier box.

    Donc j'ai 3 boites à mettre dans ce corps et la dernière boite ne veut pas se mettre à coté de la 2ème boite. Pourtant lorsque je mets un float left pour la 2èm boite, elle se mets à coté, mais pour la 3ème, elle ne se pet pas à droite à coté de la 2ème boite, mais sous la 1ère boite.
    Je vous laisse mon code, afin de m'aider à corrgier mon erreur, mais moi je ne vois pas l'erreur car j'ai fais exactement la même chose que pour la 2ème boite.

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    52
    53
    54
    55
    56
    57
    58
    59
    60
    61
    62
    63
    64
    65
    66
    67
    68
    69
    70
    71
    72
    73
    74
    75
    76
    77
    78
    79
    80
    81
    82
    83
    84
    85
    86
    87
    88
    89
    90
    91
    92
    93
    94
    95
    96
    97
    98
    99
    100
    101
    102
    103
    104
    105
    106
    107
    108
    109
    110
    111
    112
    113
    114
    115
    116
    117
    118
    119
    120
    121
    122
    123
    124
    125
    126
    127
    128
    129
    130
    131
    132
    133
    134
    135
    136
    137
    138
    139
    140
    141
    142
    143
    144
    145
    146
    147
     #corps
    {
       float: left;
    }
     
    .corps-haut
    {
       width: 958px;
       height: 30px;
       margin-left: 22px; /* Une marge à gauche pour pousser le corps, afin qu'il ne passe plus sous le menu */
       margin-top: 0px;
       background-image: url("images/corps/corps-haut1.jpg");
       background-repeat: no-repeat;
       margin-bottom: 0px;
      }  
     
     
      .corps-central
    {
       width: 958px;
       margin-left: 22px; /* Une marge à gauche pour pousser le corps, afin qu'il ne passe plus sous le menu */
       padding-top: 700px; /*  EFFACER CETTE DIMENSION POUR QUE C A SOIT EXTENSIBLE */
       margin-top:0px;
       background-image: url("images/corps/corps-central1.jpg");
       background-repeat: x-repeat;
       margin-bottom: 0px;
      }  
     
      .corps-bas
    {
       width: 958px;
       height: 24px;
       margin-left: 22px; /* Une marge à gauche pour pousser le corps, afin qu'il ne passe plus sous le menu */
       padding-top: 0px;
       background-image: url("images/corps/corps-bas1.jpg");
       background-repeat: x-repeat;
       margin-bottom: 0px;
      }  
     
     
     
     #box-photo
    {
       float: left;
    }
     
      .box-photo-haut-blanc
      {
       width: 350px;
       height: 44px;
       margin-left: 21px; /* Une marge à gauche pour pousser le corps, afin qu'il ne passe plus sous le menu */
       margin-top: 22px;
       background-image: url("images/corps/box-photo-blanc-haut.jpg");
       background-repeat: no-repeat;
     }  
     
      .box-photo-centre-blanc
      {
       width: 350px;
       height: 220px; /*  EFFACER CETTE DIMENSION POUR QUE C A SOIT EXTENSIBLE */
       margin-left: 21px; /* Une marge à gauche pour pousser le corps, afin qu'il ne passe plus sous le menu */
       margin-top: 0px;
       background-image: url("images/corps/box-photo-blanc-centre.jpg");
       background-repeat: x-repeat;
     }  
     
      .box-photo-bas-blanc
        {
       width: 350px;
       height: 44px;
       margin-left: 21px; /* Une marge à gauche pour pousser le corps, afin qu'il ne passe plus sous le menu */
       margin-top: 0px;
       background-image: url("images/corps/box-photo-blanc-bas.jpg");
       background-repeat: no-repeat;
     }  
     
     
       #box-info-noir
    {
       float: left;
    }
     
      .box-partie-haute-noir
      {
       width: 350px;
       height: 44px;
       margin-left: 10px; /* Une marge à gauche pour pousser le corps, afin qu'il ne passe plus sous le menu */
       margin-top: 23px;
       background-image: url("images/corps/box-texte-noir-haut.jpg");
       background-repeat: no-repeat;
     }  
     
      .box-partie-centre-noir
      {
       width: 266px;
       height: 220px; /*  EFFACER CETTE DIMENSION POUR QUE C A SOIT EXTENSIBLE */
       margin-left: 10px; /* Une marge à gauche pour pousser le corps, afin qu'il ne passe plus sous le menu */
       margin-top: 0px;
       background-image: url("images/corps/box-texte-noir-centre.gif");
       background-repeat: x-repeat;
     }  
     
      .box-partie-bas-noir
        {
       width: 350px;
       height: 44px;
       margin-left: 10px; /* Une marge à gauche pour pousser le corps, afin qu'il ne passe plus sous le menu */
       margin-top: 0px;
       background-image: url("images/corps/box-texte-noir-bas.jpg");
       background-repeat: no-repeat;
     }  
     
     
       #box-info-rouge
    {
       float: left;
    }
     
      .box-partie-haute-rouge
      {
       width: 266px;
       height: 13px;
       margin-left: 0px; /* Une marge à gauche pour pousser le corps, afin qu'il ne passe plus sous le menu */
       margin-top: 0px;
       background-image: url("images/corps/box-partie-rouge-haut.jpg");
       background-repeat: no-repeat;
     }  
     
      .box-partie-centre-rouge
      {
       width: 266px;
       height: 250px; /*  EFFACER CETTE DIMENSION POUR QUE C A SOIT EXTENSIBLE */
       margin-left: 0px; /* Une marge à gauche pour pousser le corps, afin qu'il ne passe plus sous le menu */
       margin-top: 0px;
       background-image: url("images/corps/box-partie-rouge-centre.jpg");
       background-repeat: x-repeat;
     }  
     
      .box-partie-bas-rouge
        {
       width: 266px;
       height: 13px;
       margin-left: 0px; /* Une marge à gauche pour pousser le corps, afin qu'il ne passe plus sous le menu */
       margin-top: 0px;
       background-image: url("images/corps/box-partie-rouge-bas.jpg");
       background-repeat: no-repeat;
     }

  5. #5
    Membre confirmé
    Profil pro
    Inscrit en
    Mai 2006
    Messages
    199
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Mai 2006
    Messages : 199
    Par défaut
    C'est bon j'ai réussi à faire passer le 3ème bloc en haut à droite à coté du bloc central.
    J'ai juste rajouter des - .
    Je ne sais pas pourquoi, ici, il faut rajouter des moins, car pour le 2ème bloc il y avait pas besoin, mais en tout cas çà marche.

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
     #box-info-rouge
    {
       float: left;
    }
     
      .box-partie-haute-rouge
      {
       width: 266px;
       height: 13px;
       margin-left: -62px; /* Une marge à gauche pour pousser le corps, afin qu'il ne passe plus sous le menu */
       margin-top: 0px;
       background-image: url("images/corps/box-partie-rouge-haut.jpg");
       background-repeat: no-repeat;
     }  
       
      .box-partie-centre-rouge
      {
       width: 266px;
       height: 250px; /*  EFFACER CETTE DIMENSION POUR QUE C A SOIT EXTENSIBLE */
       margin-left: -62px; /* Une marge à gauche pour pousser le corps, afin qu'il ne passe plus sous le menu */
       margin-top: 0px;
       background-image: url("images/corps/box-partie-rouge-centre.jpg");
       background-repeat: x-repeat;
     }  
     
      .box-partie-bas-rouge
        {
       width: 266px;
       height: 13px;
       margin-left: -62px; /* Une marge à gauche pour pousser le corps, afin qu'il ne passe plus sous le menu */
       margin-top: 0px;
       background-image: url("images/corps/box-partie-rouge-bas.jpg");
       background-repeat: no-repeat;
     }

  6. #6
    Membre confirmé
    Profil pro
    Inscrit en
    Mai 2006
    Messages
    199
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Mai 2006
    Messages : 199
    Par défaut
    Bonjour à tous.
    Voilà, je continue à coder mon site et j’ai trois soucis.
    1/ Lorsque je clique deux fois rapide sur le fichier index dans « Mes Documents », il ‘saffiche très bien, exactement comme je veux dans « INTERNET EXPORER ».
    Par contre (toujours dans mes documents) lorsque que je clique deux fois rapide sur le fichier index sous « FIREFOX MOZILLA », il s’affiche différement avec des morceaux du design un peu partout.
    2/ Le second problème c’est ceci : Comme je viens de dire ci-dessus il s’affiche bien sur « INTERNET EXPLORER » lorsqu’il n’est pas sur le net, mais dès que je mets mon site sur le net, il s’affiche plus pareille, même sous « INTERNET EXPLORER » il s’affiche mal et différement. C’est tout de même bizarre.

    3/ Je vous laisse le lien de mon site pour voir ce que çà donne sous les 2 navigateurs, en sachant que même sous "INTERNET EXPLORER", il s'affiche pas pareil lorsqu'il est sur le net ou pas (et sous MOZILLA) c'est pire et aussi m’aider à corriger çà. car j'ai revu des tutos mais j'ai l'impression de faire ce qu'il faut, mais au final, je crois bien que je prends la mauvaise direction.
    Visiter mon site
    Mon fichier CSS se nomme : designs.css

    MERCI

  7. #7
    Inactif   Avatar de Deallyra
    Profil pro
    Étudiant
    Inscrit en
    Février 2007
    Messages
    1 997
    Détails du profil
    Informations personnelles :
    Âge : 37
    Localisation : France, Loire Atlantique (Pays de la Loire)

    Informations professionnelles :
    Activité : Étudiant

    Informations forums :
    Inscription : Février 2007
    Messages : 1 997
    Par défaut
    Bonjour,

    Cela peut venir de ton hebergeur. As-tu des nom de fichiers qui correspondent, casse incluse?
    Sinon tes chemins d'accès sont absolus ou relatifs?
    *Si la réponse vous convient, n'oubliez pas le tag
    *Exprimez vous dans un français correct; on prend le temps de vous lire, prenez le temps de bien écrire.
    *Et comment on interprète votre code? N'oubliez pas la balise!

    *Pour une mise en page simple avec des divs.
    *Pour faire des formulaires xHTML CSS.

  8. #8
    Membre confirmé
    Profil pro
    Inscrit en
    Mai 2006
    Messages
    199
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Mai 2006
    Messages : 199
    Par défaut
    Salut MimiCracra44 !
    Merci de vouloir m'aider.
    j'ai quelques petites questions.
    1/ est qu'une balise "class" peut contenir une balise "id" ?
    2/ Quelqu'un m'a parlé de " mon doctype, donc l'interprétation par ie est modifié car il passe en mode Quirks " mais je n'ai rien compris. Il m'a aussi conseillé de passer du mode "STRIC" au mode "TRANSITIONNAL", mais çà n'a rien changé à mon problème.
    3/ je ne comprends pas trop ce que tu veux dire par
    casse incluse?
    Sinon tes chemins d'accès sont absolus ou relatifs?
    Merci.
    Là je suis de tout recommencer à zéro.

    En fait pour en revenir à cette balise, en fait le corps est coupé en trois.
    le haut (avec bordure arrondie), le centre et le bas (avec bordure arrondie).
    Moi je veux mettre mes infos dans la partie centre du corps.
    Avec des boites de dialogue. Est que le
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    <div class="corps-central">
    peut contenir un
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    <div id="cadre-photo">					</div>
    Je vous l'exmple :
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    <div id="corps">
    		 <div class="corps-haut">
    		</div>	
    		<div class="corps-central"> 
    			<div id="cadre-photo">
    					<div class="cadre-photo-haut-blanc"> 
    					</div> 
    					<div class="cadre-photo-centre-blanc"> 
    						<img src="images/corps/images-box-photo/om-stade-velodrome10.jpg" class="stade-velodrome" alt="stade-velodrome" title="stade-velodrome"/>
    						<p class="paragraphe1"> 
    						La victoire face à Lorient a regonflé le moral des Olympiens. Cette semaine, ils se préparent pour affronter,
    						dimanche, l’Olympique Lyonnais. Un match de prestige en pleine course-poursuite pour la troisième
    						place du championnat.<br>
    						Eric Gerets a confirmé mercredi le forfait de Mathieu Valbuena pour la réception dimanche de Lyon au Vélodrome.
    						</p>
    					</div> 
    					<div class="cadre-photo-bas-blanc"> 
    					</div>				
     
    			</div>
     
    		</div>
    		<div class="corps-bas"> 
    		</div>
     
    </div>

  9. #9
    Membre confirmé
    Profil pro
    Inscrit en
    Mai 2006
    Messages
    199
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Mai 2006
    Messages : 199
    Par défaut
    Merci c'est bon, pour l'espacement, j'ai réussi, il fallait juste mettre tout à plat au début du fichier CCS:
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    *
    {
    margin: 0;
    padding: 0;
    border: 0;
    font-family: Verdana, Arial, serif, sans-serif;
    font-size: 1em;
    font-weight: normal;
    font-style: normal;
    text-decoration: none;
    text-align: justify; 
    }
    l'espace n'y est plus.
    Merci.

    Cependant lorsque je crée un 2ème cadre juste à coté ( pour mettre des infos ), sous FIREFOX, il s'affiche bien, mais sous IEXPLORER il me décale le cadre vers la droite. Ici
    Je n'arrive pas à résoudre ce problème. J'ai essayé plein de modification dans mon code, mais çà marche pas. Si par exemple je fais un :
    ou
    un padding-left: -10px;
    Il me décale tout le cadre noir vers la gauche mais c'est plus bon, car du coup sous FIREFOX aussi il me le décalle vers la gauche et donc le cadre noir se colle avec le cadre blanc.
    Voici, le code des deux cadre dont je vous parle :
    Pour le cadre blanc :
    #cadre-photo
    {
    float: left;
    }

    .cadre-photo-haut-blanc
    {
    width: 350px;
    height: 44px;
    margin-left: 23px; /* Une marge à gauche pour pousser le corps, afin qu'il ne passe plus sous le menu */
    margin-top: 0px;
    background-image: url("images/corps/box-photo-blanc-haut.jpg");
    background-repeat: no-repeat;
    }

    .cadre-photo-centre-blanc
    {
    width: 350px;
    margin-left: 23px; /* Une marge à gauche pour pousser le corps, afin qu'il ne passe plus sous le menu */
    margin-top: 0px;
    background-image: url("images/corps/box-photo-blanc-centre.jpg");
    background-repeat: repeat-y;
    }

    .cadre-photo-bas-blanc
    {
    width: 350px;
    height: 44px;
    margin-left: 23px; /* Une marge à gauche pour pousser le corps, afin qu'il ne passe plus sous le menu */
    margin-top: 0px;
    background-image: url("images/corps/box-photo-blanc-bas.jpg");
    background-repeat: no-repeat;
    }
    Pour le cadre noir :
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    #cadre-noir
    {
       float: left;
    }
     
      .cadre-noir-partie-haute
      {
       width: 266px;
       height: 44px;
       margin-left: 10px; /* Une marge à gauche pour pousser le corps, afin qu'il ne passe plus sous le menu */
       margin-top: 0px;
       background-image: url("images/corps/box-texte-noir-haut.jpg");
       background-repeat: no-repeat;
     }  
     
      .cadre-noir-partie-centre
      {
       width: 266px;
       height: 420px; /*  EFFACER CETTE DIMENSION POUR QUE C A SOIT EXTENSIBLE */
       margin-left: 10px; /* Une marge à gauche pour pousser le corps, afin qu'il ne passe plus sous le menu */
       margin-top: 0px;
       background-image: url("images/corps/box-texte-noir-centre.gif");
       background-repeat: x-repeat;
     }  
     
      .cadre-noir-partie-basse
        {
       width: 266px;
       height: 44px;
       margin-left: 10px; /* Une marge à gauche pour pousser le corps, afin qu'il ne passe plus sous le menu */
       margin-top: 0px;
       background-image: url("images/corps/box-texte-noir-bas.jpg");
       background-repeat: no-repeat;
     }

  10. #10
    Membre confirmé
    Profil pro
    Inscrit en
    Mai 2006
    Messages
    199
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Mai 2006
    Messages : 199
    Par défaut
    Bonjour à tous !
    Y a personne pour m'aider à corriger ce problème de décalage avec Internet Explorer alors que sous Mozilla çà s'affiche très bien !
    Je galère vraiment depuis 2 voir 3 jours sur ce détails là et j'avance pas. J'ai beau lire des forums ou tutos sur internet, mais je n'arrive pas à corriger ce soucis.
    je vous laisse l'adresse pour voir ce que çà donne sous les 2 navigateurs : Voir Ici

    Merci à vous.

  11. #11
    Membre Expert
    Avatar de Candygirl
    Femme Profil pro
    Inscrit en
    Juillet 2006
    Messages
    1 912
    Détails du profil
    Informations personnelles :
    Sexe : Femme
    Âge : 53
    Localisation : Suisse

    Informations forums :
    Inscription : Juillet 2006
    Messages : 1 912
    Par défaut
    Citation Envoyé par °°° Zen-Spirit °°° Voir le message
    2/ Le second problème c’est ceci : Comme je viens de dire ci-dessus il s’affiche bien sur « INTERNET EXPLORER » lorsqu’il n’est pas sur le net, mais dès que je mets mon site sur le net, il s’affiche plus pareille, même sous « INTERNET EXPLORER » il s’affiche mal et différement. C’est tout de même bizarre.
    Ton hébergeur rajoute un script tout en haut de ton document, avant le doctype, cela a un impacte sur IE qui interprète alors ta page en mode quirks, sans compter sur le propogue xml qui fait aussi passer IE6 en mode quirks...

    En local, vu que tu n'as rien avant le doctype (enfin, à part la déclaration xml), ton site est interprété en mode presque standard par IE7 d'où un résultat plus proche des autres navigateurs.

    Tu devrais commencer par héberger ta page ailleurs
    Les bons réflexes:
    • avant de poser une question:
      règles | faq | tutoriels | recherche
    • clarté, politesse, vocabulaire et orthographe soignés = efficacité
    • remercier ceux qui ont pris le temps d'aider et :resolu: si c'est le cas

  12. #12
    Membre Expert Avatar de Erwan31
    Profil pro
    Inscrit en
    Février 2008
    Messages
    2 177
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Février 2008
    Messages : 2 177
    Par défaut
    Bon ben CandyGirl à répondu à ma place

    Même remarque donc, je te conseil vivement de changer d'hébergement et d'en choisir un qui évitera d'afficher des pus de partout, ça fait fuir pas mal de visiteurs.

    Le mode Quirks est la première chose à éviter si tu veux éviter les prises de s
    têtes inutiles et des différences d'affichage parfois difficilement anticipables surtout quand on débute.
    Le passage en mode standard resoudra par exemple ton problème de
    centrage de la page sous IE.

    je te conseil d'utiliser un doctype xHTML transitionnal en ayant si possible préalablement appris les règles syntaxique du xHTML.

  13. #13
    Membre confirmé
    Profil pro
    Inscrit en
    Mai 2006
    Messages
    199
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Mai 2006
    Messages : 199
    Par défaut
    Salut Cadygirl !
    1/ Merci de m'avoir donné une réponse tant attendue.
    2/ Sinon, tu penses qu'il n'y a aucune autre solution que de changer d'hébergeur ?
    Il n'y a pas un code qui permet de rectifier çà sous IEXPLORER ?
    3/ Aussi, avec FREE, tu sais si çà peut coder le même soucis ou pas ?
    Merci encore.
    Au moins j'ai eu une réponse. car qu'est ce que j'ai galéré et perdu du temps.
    Jamais je n'aurai trouvé çà tout seul.

  14. #14
    Membre confirmé
    Profil pro
    Inscrit en
    Mai 2006
    Messages
    199
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Mai 2006
    Messages : 199
    Par défaut
    Citation Envoyé par Erwan31 Voir le message
    Bon ben CandyGirl à répondu à ma place
    Merci quand même Erwan.
    Donc pour récapituler, mon codage CSS et HTML est correct, c'est juste un problème de d'hébergeur ?
    Tu me le confirmes !
    Comme çà maintenant je vais pouvoir continuer.
    Je pousse un grand Ouf ! Car après 3 jours ou je n'ai pas avancé du tout, je vais enfin continuer.
    Un grand Merci à vous.

  15. #15
    Expert confirmé
    Avatar de 12monkeys
    Homme Profil pro
    Webmaster
    Inscrit en
    Novembre 2006
    Messages
    4 093
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 48
    Localisation : France, Puy de Dôme (Auvergne)

    Informations professionnelles :
    Activité : Webmaster
    Secteur : Service public

    Informations forums :
    Inscription : Novembre 2006
    Messages : 4 093
    Par défaut
    Citation Envoyé par °°° Zen-Spirit °°° Voir le message
    3/ Aussi, avec FREE, tu sais si çà peut coder le même soucis ou pas ?
    Si, comme j'ai compris, le problème vient du code intégré à ta page par ifrance, alors chez free tu n'auras pas ce souci étant donné que chez free ils n'intègrent pas de code dans tes pages...

  16. #16
    Membre confirmé
    Profil pro
    Inscrit en
    Mai 2006
    Messages
    199
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Mai 2006
    Messages : 199
    Par défaut
    Merci 12Monkeys !
    J'ai pris note.

    JE vais maintenant continuer mon petit site.
    Par contre je me réserve le droit de revenir vers vous si d'autres besoins d'info devaient intervenir.
    ++

  17. #17
    Membre Expert Avatar de Erwan31
    Profil pro
    Inscrit en
    Février 2008
    Messages
    2 177
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Février 2008
    Messages : 2 177
    Par défaut
    Pour info, j'ai édité mon message précédent.

    Citation Envoyé par °°° Zen-Spirit °°° Voir le message
    Merci quand même Erwan.
    Donc pour récapituler, mon codage CSS et HTML est correct, c'est juste un problème de d'hébergeur ?
    Tu me le confirmes !
    Non tes problèmes d'affichage viennent en partie du fait que l'absence de Doctype faisait basculer les navigateurs récents en mode de rendu Quirks
    (non standard et propriétaire) qui favorise des différences d'affichages entre navigateurs.

    Pour partir d'une bonne base, je te conseil l'outil squelettor

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    *
    {
    margin: 0;
    padding: 0;
    }
    Pour le reset CSS tu peux commencer par t'en tenir à ce code pour mais cela représente certains inconvénients, relis mon premier message

    Oublies tout le reste et passe font-family: Verdana, Arial, serif, sans-serif; dans le body

Discussions similaires

  1. Aide pour commencer mon site WEB svp
    Par shubakas dans le forum Débuter
    Réponses: 7
    Dernier message: 10/05/2008, 09h17
  2. [FLASH MX] Probleme sur mon site....!!
    Par thewill dans le forum Flash
    Réponses: 2
    Dernier message: 07/04/2005, 12h11
  3. [VB.NET] Proteger mon site par mot de passe
    Par stephane93fr dans le forum ASP.NET
    Réponses: 8
    Dernier message: 19/01/2004, 08h53
  4. Débutant : architecture de mon site flash.
    Par Jazzy Troll dans le forum Flash
    Réponses: 3
    Dernier message: 12/01/2004, 16h36

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo