28173 sujets

CSS et mise en forme, CSS3

Bonjour,

Voici pour commencer le site concerné : http://www.f1results.info/v3. A regarder sous IE, car il n'est pas encore oprimisé pour tous les navigateurs (il est en constuction).

Mon problème : tout en haut de la page, il y a un saut de ligne que je ne veux pas et que je ne comprends pas. Voilà le début du code de la page :

<body>
<div id="centre">
<!-- Entête -->
<INCLURE(page.php3){fond=entete}>
[...]


J'utilise SPIP et ces "inclure" sont équivalents à des include en php (include entete.php3 et menu.php3).

Voilà aussi le début de l'entête :

<div class="entete">
<div class="navigation"><img src="<?php echo $file_images ?>/dossier.gif" width="20" height="16" border="0" />&nbsp;<?php echo $nom_site ?> > <?php echo $titre_page ?></div>
<div class="recrutement"><a href="<?php echo $add_site ?>./recrutement.php" class="lien_recrutement">DEVENEZ REDACTEUR POUR F1RESULTS</a></div>
<img src="<?php echo $file_images ?>/haut.bmp" alt="Haut" width="785px" />
</div>
[...]


Et enfin les styles "body", "centre" et "entete" inclus dans la CSS :

body {
background-color:#1D508D;
text-align:center;
width:98%;}

#centre {
border-left:#1D508D 1px solid;
border-right:#222222 1px solid;
width:785px;
text-align:left;}

.entete {
width:785px;
font-family:Verdana;
font-size:12px;
font-weight:bold;
background-color:#cfcfcf;}


Je ne vois donc pas d'où vient ce saut de ligne et je pense que ca vient de la CSS, mais j'avoue ne pas en être sûr.

Merci d'avance de otre aide !

@++
Modifié par Alomon (19 Jul 2006 - 18:16)
Bonjour,

Je n'ai pas regardé de près le code.
Mais à première vue (via un éditeur de CSS en ligne), en précisant une marge supérieur à 0 dans le body ton problème est réparé sous Mozilla Firefox.


body {
 background-color:#1D508D;
 text-align:center;
 width:98%;
 margin-top: 0;
}

Salut Alomon

Rajoute ça à ton body :


body {
background-color:#1D508D;
text-align:center;
width:98%;
margin: 0;
padding: 0;
}


@++
Parfait ! C'était bien ca !

Ca m'a aussi permis d'enlever le width : si je mettais plus de 98%, la page pouvait défiler en largeur...

Merci beaucoup pour votre aide rapide et si efficace ! Smiley cligne

@++
P.S. : pilate68, le padding est apparemment inutile ici : je l'ai enlever pour tester la solution de Sebastien D. et ca marche aussi bien...