faire divs flux tandis que l'un est plus élevé que le reste d'entre eux

Je le code CSS suivantfaire divs flux tandis que l'un est plus élevé que le reste d'entre eux

.container { 
width:800px; 
background-color:yellow; 
margin:auto; 
display:table; 
} 
.cell { 
float:left; 
display:table-cell; 
background-color:blue; 
width:100px; 
height:50px; 
} 
.middel{ 
background-color:purple; 
height:100px;} 
.wrong{ 
background-color:green; 
}

et le code html suivant

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 
<head> 
<title> new document  </title> 
<meta name="generator" content="editplus"> 
<meta name="author" content=""> 
<meta name="keywords" content=""> 
<meta name="description" content=""> 
<link rel="stylesheet" type="text/css" media="screen" href="grid.css" /> 
<meta http-equiv="content-type" content="text/html;charset=iso-8859-1" > 
</head> 
<body> 
<div class="container"> 
<div class="cell">1</div> 
<div class="cell">2</div> 
<div class="cell">3</div> 
<div class="cell middel">4</div> 
<div class="cell">5</div> 
<div class="cell">6</div> 
<div class="cell">7</div> 
<div class="cell">8</div> 
<div class="cell wrong">9</div> 
<div class="cell wrong">10</div> 
<div class="cell wrong">11</div> 
<div class="cell wrong">12</div> 
<div class="cell">13</div> 
<div class="cell">14</div> 
<div class="cell">15</div> 
<div class="cell">16</div> 
</div> 
</body> 
</html>

c'est un lien vers la page html et un image sur la façon dont je veux la mise en page et de regarder la façon dont il semble en fait, son difficile à expliquer avec des mots

example and image with the correct layout

comment puis-je obtenir le div après le div pourpre sur le côté gauche de la div pourpre et faire couler les autres sur le côté droit? Dans le résultat final, vous devriez être en mesure de placer le div violet n'importe où entre les autres div et le flux devrait être le même.

espoir je l'ai expliqué clairement

remerciements et salutations, Mark

Salutations Mark,

Source

2010-06-24 xram12

Si cela est * possible *, ce sera compliqué. Je recommande jQuery ou PHP et plus de classes CSS. – thomasfedb

Au risque de puristes offensants, cela ressemble à un emploi pour les tables! ;-) Utiliser divs est plus correct, mais l'implémentation est beaucoup plus facile avec les tables. Si vous avez besoin de plus d'aide pour le code d'une table, faites le moi savoir et je devrais être capable de fouetter quelque chose rapidement.

Source

2010-06-24 16:29:27

Upvote pour vous, rien de mal à utiliser des tables pour afficher des données. –

Je sais que cela peut être fait avec des tables, j'espérais qu'il y avait un moyen de le faire avec divs. Je veux dire que c'est une jolie grille de mise en page standard. J'ai posé la question parce que je voulais être sûr que c'est impossible de faire avec div et sans toutes sortes de choses javascript. suppose que tu as répondu à ma question. merci – xram12

Merci beaucoup pour les commentaires! XRam, je suis désolé de ne pas avoir de meilleures nouvelles pour vous. –

faire divs flux tandis que l'un est plus élevé que le reste d'entre eux

Répondre

Questions connexes