[RESOLU] H3 dans un div: un margin-top fantome pousse mon h3 en bas

Bonjour,

j'ai un petit bout de css qui commence à m'embêter.
Il s'agit d'un simple h3 placé dans un div, le problème est que le h3 se trouve poussé vers le bas comme si je lui appliquait un margin-top. Je ne peux malheureusement pas tester ça sur IE6 car je ne l'ai pas, mais sur IE7, le probleme est bien visible. Et bien évidemment, pour rester fidele à la tradition, tout marche bien sur FF et Opera.

voici le css:

.main #sidebar2 {
float: right; 
width: 180px; 
background-color: #CCCCCC; 
text-align: center;
}
.main #sidebar2 h3 {
color: #fff;
font-size: 1.4em;
font-weight: normal;
background-color: #666;
text-align: center;
line-height:20px;
margin: 0 auto;
height: 20px;
width: 150px;
}

Et voici le html:

<div id="sidebar2">
        <h3>News</h3>
        <div id="headlines">
        </div>
        
      </div>

Ce serait cool d'essayer de me guider afin que je trouve l'origine du prob sur IE7 (et eventuellement IE6 ou autre).
Merci d'avance.
Modifié par hatembr (19 Mar 2008 - 11:28)

problème résolu !

j'ai complètement zappé cette partie placée dans le header :

 
<!--[if IE 5]>
    <style type="text/css"> 
    /* placer les corrections pour le modèle de boîte css pour IE 5.x dans ce commentaire conditionnel */
    .main #sidebar1 { width: 180px; }
    .main #sidebar2 { width: 190px; }
    </style>
    <![endif]--><!--[if IE]>
    <style type="text/css"> 
    /* placer les corrections pour toutes les version d'IE dans ce commentaire conditionnel */
    [#red].main #sidebar2, .main #sidebar1 { padding-top: 30px; }
    .main #mainContent { zoom: 1; }
    /* la propriété propriétaire zoom ci-dessus transmet à IE l'attribut hasLayout nécessaire pour éviter plusieurs bogues */
    </style>
    <![endif]-->

Modifié par hatembr (19 Mar 2008 - 11:53)