Considérons le code HTML et CSS suivants. Le résultat souhaité est que les deux boîtes roses sont centrées dans la boîte verte unique. Le texte n'est PAS centré. Il y a un rembourrage sur la gauche et la droite de chaque boîte. Je devrais être en mesure d'avoir 1 ou plusieurs de ces boîtes, jusqu'à 8; ils devraient tous flotter pour remplir le conteneur div. Je me suis cogné la tête sur celui-ci depuis des semaines, et rien que je lis ou essaye semble fonctionner - marge: auto, affichage: inline, etc. etc. J'ai ajouté le div box-margin pour créer le remplissage en essayant d'utiliser margin: auto, mais ça n'a toujours pas eu le résultat que je cherchais. Halp?Encore un autre centre DIVs à l'intérieur d'une autre question DIV
HTML
<body>
<div id="page">
<div id="main">
<div class="box-group">
<div class="box-margin">
<div class="box">
<h2>Data</h2>
<ul>
<li><a href="/URL">Link</a></li>
</ul>
</div>
</div>
<div class="box-margin">
<div class="box">
<h2>Reports</h2>
<ul>
<li><a href="/URL/">Link</a></li>
</ul>
</div>
</div>
</div>
</div>
</div>
</body>
CSS
body
{
margin: 0;
padding: 0;
}
#page
{
width: 95%;
min-width:800px;
border: thin solid red;
}
#main
{
padding: 30px 30px 15px 30px;
margin-bottom: 30px;
min-width: 875px;
border: thin solid black;
}
.box-group
{
width: 100%;
padding: 10px;
border: thin solid green;
}
.box-margin
{
margin: auto;
width: 275px;
float: left;
padding: 15px;
}
.box
{
border: thin ridge pink;
height: 200px;
width: 250px;
}
"Le résultat souhaité est que les deux boîtes roses sont centrées dans la boîte verte unique Le texte n'est PAS centré." - Donc vous voulez que le texte soit centré ou pas? –
Désolé Christopher - Le texte ne doit pas être centré, c'est pourquoi l'alignement du texte ne fonctionnera pas. – morganpdx