J'ai un problème avec un site sur lequel je travaille où la bonne enveloppe continue de tomber en dessous du site. Évidemment, je veux qu'il reste du bon côté.CSS: encapsuleur de droite dépose la fin de la page
J'ai codé un cas de test qui montre mon problème (je pense) et je me demande s'il y a une meilleure façon de faire les choses.
L'URL du site est http://www.musicworkshop.co.nz/
Ci-dessous le cas de test qui (je pense) est la cause de mon problème, mais il ne peut pas être. La boîte rose tombe si elle ne rentre pas dans la largeur de la page.
J'ai également inclus un diagramme de ce que j'essaye d'accomplir avec une capture d'écran de l'emballage droit pas où il devrait être.
Y a-t-il une meilleure façon de procéder?
John
<html>
<head>
<title> Test page </title>
<link rel="stylesheet" href="test.css" type="text/css" />
</head>
<body>
<div id="superbox">
<div id="box1">
</div>
<div id="box2">
</div>
<div id="box3">
</div>
<div id="box4">
</div>
<div id="box5">
</div>
<div id="box6">
</div>
</div>
</body>
</html>
#superbox{
width: 1000px;
height: 100px;
margin: 0 auto;
}
#box1{
height: 100px;
width: 200px;
background: red;
float: left;
}
#box2{
height: 100px;
width: 200px;
background: yellow;
float: left;
}
#box3{
height: 100px;
width: 200px;
background: blue;
float: left;
}
#box4{
height: 100px;
width: 200px;
background: green;
float: left;
}
#box5{
height: 100px;
width: 200px;
background: grey;
float: left;
}
#box6{
height: 100px;
width: 200px;
background: pink;
float: left;
}
alt text http://www.musicworkshop.co.nz/website.png
alt text http://www.musicworkshop.co.nz/website_right-wrap-missing.png
Mis à jour ma réponse avec ce que je crois être une solution pour votre site. Si ce n'est pas le cas, postez un commentaire pour que je puisse le modifier. Si c'est le cas, assurez-vous d'appuyer sur la "coche" qui la marque comme la réponse acceptée. –