28220 sujets

CSS et mise en forme, CSS3

Bonjour.

Nous avons encore une illustration des différences de comportement des navigateurs
vis à vis de CSS.

La div principale est contrainte "absolute" pour le placement horizontal. Elle dépend donc de body qui est "caractériel".

En positionnant cette propriété à "relative", on libère un peu le div sous IE (on voit la bordure du bas), mais ce n'est pas encore suffisant. En effet, margin-bottom et padding-bottom restent inopérant (sous IE, çà va de soit).
Maintenant, un padding-bottom:10px dans body crée la marge désirée sous le div. (sous IE et FF)

En résumé:

body {[b]padding: 0 0 10px 0[/b]; margin:0;

/* debut HEAD*/

#contenant
{
font-family:arial, Helvetica, Trebuchet MS,sans-serif;
font-size:11px;
[b]position:relative;[/b]
width:770px;
left:50%;
margin-left: -375px;
background-color:#F4E9D7;/*couleurmenugauche*/
border:1px solid black;
margin-top:10px;
[b]margin-bottom:0px;/[/b]*ne marche pas (et non... [sweatdrop] )*/
}


Si quelqu'un a des remarques sur cet exemple, les commentaires sont bienvenus.
Bonjour,

Eviter le centrage par cette technique de marges négatives : la partie gauche de la page sera rognée sans espoir en cas de résolution insuffisante.

utiliser de préférence le centrage par les marges auto, qui ne pose pas ce problème, et évite de passer par un positionnement.