сделать поток DIVS, пока один из них выше, чем остальные - PullRequest
1 голос
/ 24 июня 2010

У меня есть следующий код CSS

.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;
}

и следующий HTML-код

<!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>

это ссылка на HTML-страницу и изображение о том, как я хочу, чтобы макетПосмотрите и как это на самом деле выглядит, это трудно объяснить словами

пример и изображение с правильной компоновкой

как мне получить div после фиолетового div налевая сторона фиолетового div и заставить другие перетекать в правую сторону?

в конечном итоге вы сможете разместить фиолетовый div где-нибудь между другими div, и поток должен быть таким же.

надеюсь, я объяснил это ясно

спасибо и привет Марк,

привет Марк,

1 Ответ

2 голосов
/ 24 июня 2010

С риском обидеть пуристов, это похоже на работу за столами!;-) Использование divs более корректно, но с таблицами реализация намного проще.Если вам понадобится дополнительная помощь с кодом для таблицы, дайте мне знать, и я смогу довольно быстро что-то подсунуть.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...