J'essaie de finir le CSS et le balisage de mon site (jonathanbuys.com), mais j'ai ce problème ennuyeux à éclaircir. Pour les pages où tout le texte est visible horizontalement sans défilement, ma marge inférieure est correctement définie pour 30px. Cependant, dès que le contenu dépasse la taille horizontale de la fenêtre du navigateur, le bas de la marge disparaît.Webkit ne respectant pas margin-bottom si le texte dépasse l'écran visible
Je l'ai testé en utilisant Firefox, Safari, Chrome et les weblits Webkit, et cela semble se produire uniquement avec les navigateurs basés sur Webkit.
Voici le CSS pertinent:
#wrapper{
width: 720px;
height: auto;
margin: 30px auto 30px auto;
padding: 3em 3em 3em 3em;
border: 1px solid #ccc;
text-align: left;
background: white;
-webkit-box-shadow: 2px 2px 8px #aaa;
-moz-box-shadow: 2px 2px 8px #aaa;
box-shadow: 2px 2px 8px #aaa;
}
Et la mise en page de base du site:
<!DOCTYPE html>
<html lang="en">
<head>
<link rel="stylesheet" href="/css/style.css" type="text/css" />
</head>
<body>
<div id="wrapper">
<div id="sidebar">
<div id="logobox">
</div>
<div id="pages">
</div>
</div>
<div id="content">
<h2>Heading</h2>
<p class="thin_line"></p>
<div id="post">
text
</div>
</div> <!-- End of content div -->
<div id="footer">
<p class="thin_line"></p>
</div>
</div>
</body>
</html>
Toute idée de ce que je suis absent?
Merci d'avance.
Cela a fait l'affaire, merci! – iBuys