Форум: Форум PHPФорум ApacheФорум Регулярные ВыраженияФорум MySQLHTML+CSS+JavaScriptФорум FlashРазное
Новые темы: 0000000
PHP 5. На примерах. Авторы: Кузнецов М.В., Симдянов И.В., Голышев С.В. Самоучитель PHP 5 / 6 (3 издание). Авторы: Кузнецов М.В., Симдянов И.В. MySQL 5. В подлиннике. Авторы: Кузнецов М.В., Симдянов И.В. MySQL на примерах. Авторы: Кузнецов М.В., Симдянов И.В. PHP Puzzles. Авторы: Кузнецов М.В., Симдянов И.В.
ВСЕ НАШИ КНИГИ
Консультационный центр SoftTime

HTML+CSS+JavaScript

Выбрать другой форум

 

Здравствуйте, Посетитель!

вид форума:
Линейный форум Структурный форум

тема: Вёрстка DIV
 
 автор: aleksej_sumarok   (24.02.2009 в 12:42)   письмо автору
 
 

Подскажите как можно сделать такое на дивах? Заранее благодарю.

http://shelkunchik.lv/div.jpg

  Ответить  
 
 автор: AlexSol   (24.02.2009 в 13:02)   письмо автору
 
   для: aleksej_sumarok   (24.02.2009 в 12:42)
 

чтобы после достижения в высоту 4блоков автоматически начинался новый столбец? никак

  Ответить  
 
 автор: aleksej_sumarok   (24.02.2009 в 14:19)   письмо автору
 
   для: AlexSol   (24.02.2009 в 13:02)
 

Ну автоматически вообще-то не нужно. Нужно просто чтобы желтые квадратики влезли в красную область. Может кто-нибудь ещё знает каким образом это можно сделать?


<style type="text/css">
    #kvadrat { border: 1px; border-style: solid; width: 40px; height: 40px; text-align: center;  background-color: yellow; }
    #table { border: 1px; border-style: solid; height: 170px; background-color: red; }
</style>

<div id="table">
    <div id="kvadrat">1</div>
    <div id="kvadrat">2</div>
    <div id="kvadrat">3</div>
    <div id="kvadrat">4</div>
    <div id="kvadrat">5</div>
    <div id="kvadrat">6</div>
</div>

  Ответить  
 
 автор: ddhvvn   (24.02.2009 в 14:26)   письмо автору
 
   для: aleksej_sumarok   (24.02.2009 в 14:19)
 

-

  Ответить  
 
 автор: AlexSol   (24.02.2009 в 14:39)   письмо автору
 
   для: aleksej_sumarok   (24.02.2009 в 14:19)
 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251" />
<title>Untitled Document</title>
</head>

<body>
<style type="text/css">
.kvadrat { border: 1px; border-style: solid; width: 40px; height: 40px; text-align: center; background-color: yellow; }
.td {float:left}
#table { border: 1px; border-style: solid; height: 170px; background-color: red; }
</style>

<div id="table">
<div class="td">
<div class="kvadrat">1</div>
<div class="kvadrat">2</div>
<div class="kvadrat">3</div>
<div class="kvadrat">4</div>
</div>
<div class="td">
<div class="kvadrat">5</div>
<div class="kvadrat">6</div>
</div>

<div style="clear:both"></div>
</div>

</body>
</html>

  Ответить  
Rambler's Top100
вверх

Rambler's Top100 Яндекс.Метрика Яндекс цитирования