Naime, pokušavajući prethodnu noć da rešim problem na koji sam naišao, i nakon višečasovnog mozganja da li je uopste logično to što pokušavam, odlučio sam da redukujem kod i posavetujem se sa vama.
Problem je sledeći:
Imam DIV koji se prostire određenom širinom (width:800px;padding:20px) koji unutar sebe sadrži manje DIV-ove koji "plutaju" jedan za drugim.
Ovi unutrašnji DIV-ovi imaju u sebi neke forme, grafike, druge block elemente - header-e, p... Oni se generišu dinamički i njihov broj se menja, mislim da ih najviše može biti 4 mada to i nije sad važno. Imaju konačne dimenzije (200px). Height i border su u kodu samo da bi se DIV-ovi videli, naravno.
Danas sam potražio slične teme na netu, ali moram priznati da nisam uspeo da nađem rešenje. Spominju se ovakvi problemi (čak i varijante sa javascript-om i php-om) ali nigde ne vidim rešenje koje to potvrđuje, niti je kod primenjen na ovaj moj dao ikakve promene. Probao sam različite display vrednosti, ali ništa. Čak ni neki bug za IE na koji sam naišao (navodno bi IE treba ovo da prikaže kako želim zbog nekog bug-a ?!) ne radi : )
Evo ga kod:
<!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=utf-8" />
<title>Title</title>
<style type="text/css">
html, body, div, #container, .holder {
margin: 0;
padding: 0;
}
html, body {
width:100%;
background-color:#CCC;
}
#container {
position:relative;
margin:100px auto 20px;
padding:20px;
background-color:#FFF;
width:800px;
overflow:hidden;
text-align:center; /* Neuspeli pokusaj centriranja blok elementa kao da je inline */
}
.holder { /* Holder-i bi sadrzali blok elemente i neku sliku npr. */
position:relative;
float:left;
width:200px;
height:200px;
margin:0 10px 0 0;
border:1px solid #CCC;
}
</style>
</head>
<body>
<div id="container">
<div class="holder"> </div>
<div class="holder"> </div>
<div class="holder"> </div>
</div>
</body>
</html>
Zanima me čisto CSS i XHTML razmišljanje - ukoliko je moguće, i ako je moguće rad sa DIV-ovima - ako se radi sa tabelama ovo je lakše izvesti - ili mi se bar tako čini :-/
Svaka pomoć, bilo u vidu koda ili linkova bi mi značila. Hvala u napred.