div-oве в един ред ?

[ReXTaN]

Как мога да направя следното:

Ето го кода само за div:

 <div id="central">
<div id="zaglavie">Последни теми от форума:</div>
<div id="box">
Скоро...
</div>

<div id="zaglavie">Последни теми от форума:</div>
<div id="box">
Скоро...
</div>
</div>

И ето го и CSS за div-а

div#central {
width:auto; height:auto;
float:left;
padding:5px;
}

div#zaglavie {
width:200; height:20px;
border:1px solid #999;
background-color:#EFEFEF;
padding:0px;
background-image: url('img/cellpic1.gif');
}

div#box {
width:200; height:auto;
border:1px solid #999; border-top:0px;
margin-bottom:10px; padding:4px;
background-color: #fff;
}

 

[miro91]

<div id="central">
<div class="zaglavie">Последни теми от форума:</div>
<div class="box">
Скоро...
</div>

<div class="zaglavie">Последни теми от форума:</div>
<div class="box">
Скоро...
</div>
</div>

HTML-а така.

div.zaglavie {
width:200; height:20px;
border:1px solid #999;
background-color:#EFEFEF;
padding:0px;
background-image: url('img/cellpic1.gif');
float: left;
}
div.box {
width:200; height:auto;
border:1px solid #999; border-top:0px;
margin-bottom:10px; padding:4px;
background-color: #fff;
float: left;
}

когато един елемент примерно див ще го слагаш два пъти не го прави ID а го прави CLASS защото няма да ти е валиден кога. и добавяш float: left samo.

 

[debian]

<table cellspacing="0" cellpading="0" border="1">
<tr>
<td width="200" bgcolor="red">saddfsd</td>
<td width="200" bgcolor="red">sdfsdgfdsgdsgdf</td>
</tr>
<tr>
<td width="200" bgcolor="yellow">sdfsasdasdas</td>
<td width="200" bgcolor="yellow">sdfsdg</td>
</tr></table>

Колко по-лесно е с таблици и колко по-малко код се използва

 

[miro91]

<table cellspacing="0" cellpading="0" border="1">
<tr>
<td width="200" bgcolor="red">saddfsd</td>
<td width="200" bgcolor="red">sdfsdgfdsgdsgdf</td>
</tr>
<tr>
<td width="200" bgcolor="yellow">sdfsasdasdas</td>
<td width="200" bgcolor="yellow">sdfsdg</td>
</tr></table>

Колко по-лесно е с таблици и колко по-малко код се използва

таблиците са малко по старички от дивовете пък и е по-добре сайта да е на дивове отколкото с таблици.

 

[ReXTaN]

<table cellspacing="0" cellpading="0" border="1">
<tr>
<td width="200" bgcolor="red">saddfsd</td>
<td width="200" bgcolor="red">sdfsdgfdsgdsgdf</td>
</tr>
<tr>
<td width="200" bgcolor="yellow">sdfsasdasdas</td>
<td width="200" bgcolor="yellow">sdfsdg</td>
</tr></table>

Колко по-лесно е с таблици и колко по-малко код се използва

Преди да погледна темата и аз се сетих за таблици
Но все пак ако ми обесните тези тагчета за какво служат в сайтовете в table:

cellspacing="0" cellpading="0"

 

[StormBreaker]

cellspacing="0" cellpading="0" служат за премахване на разстоянието между редовете и колоните.

 

[adrian]

Добре си започнал с div. Не се отказвай. Ако имаш някакви проблеми по-добре питай, за да ти се разяснят, а не прибягвай веднаг към таблиците. Таблиците са се използвали за оформяне на дизайн, когато още css не е предлагал толкова много възможности. Най-добре е да погледнеш този урок на mute. Аз лично от него започнах да правя сайтовете си само с div.

А за cellspacing и cellpadding да бъда малко по-точен ще кажа, че:
1. cellspacing се използва, за да се промени разстоянието между отделните клетки. Това ще рече, че се променя широчината на рамката между отделните клетки. Така както бордера е сложен на 1, за да разбереш какво точно прави сложи му стойност 20 на cellspacing и ще разбереш.
2. cellpadding се използва за задаване на какво разстояние да е текста от самия бордер на клетката. И при cellpadding сложи по-голямо число, за да видиш точно действието му.

П.С. Не се отказвай от div, защото ти казват, че е по-лесно от таблиците. И така да е с div и css можеш да постигнеш повече неща, който с таблици трябва да правиш по 2 или 3 вложени таблици.

И понеже видях, че никой не ти е дал точно как да стане.

<div id="central">
<div class="left">
<div class="zaglavie">Последни теми от форума:</div>
<div class="box">
Скоро...
</div>
</div>
<div class="right">
<div class="zaglavie">Последни теми от форума:</div>
<div class="box">
Скоро...
</div>
</div>
</div>

и css

div.zaglavie {
width:200; height:20px;
border:1px solid #999;
background-color:#EFEFEF;
padding:0px;
background-image: url('img/cellpic1.gif');
}
div.box {
width:200; height:auto;
border:1px solid #999; border-top:0px;
margin-bottom:10px; padding:4px;
background-color: #fff;
}
div.left {
float: left;
}
div.right {
margin-left: 5px; // Това е сложено, защото иначе ще се залепят един за друг дивовете.
float: left;
}

Редактирал съм кода на miro91, защото е по-чист от твоя
Може да има и по-лесен начин да се направи, но е още много рано, за да мисля толкова

 

[shterev]

Таблиците вече са стар метод, а и се използват само за таблична информация, продължавай си с div-ове.