ugrás a tartalomhoz

Floatolt tartalommal együtt nem nő a div mérete

Anonymous · 2006. Jan. 9. (H), 15.41
Sziasztok.

Megkért egy ismerős, hogy csináljam meg az oldalát, amit CSS segítségével szeretnék megvalósítani, bár még nem nagyon ismerem.

Az a problémám, hogy a tartalommal együtt nem nyúlnak a divek. Egyszerűen nem tudom, miért nem.

Ha valaki segítene, nagyon hálás lennék. Ha pedig valamit nem jól csináltam, abban is várom tanácsaitokat.

Fko

#felso {
	margin-left: auto;
        margin-right: auto;
	background-image: url(tuz.jpg);
	width: 775px;
	height: 367px;		
}

#also {
	margin-left: auto; 
	margin-right: auto;
	width: 775px;
	background-color: #475c9a;	
	border-top: dotted #fff 1px;
	border-bottom: dotted #fff 1px;
}

#elso {
	position: absolute;
	width:170px;		
	min-height: 700px;
	border-left: dotted #fff 1px;	
	border-right: dotted #fff 1px;
	margin-left: 9px;
}

#masodik {		
	margin-left:180px;	
	height:auto;
	min-height: 700px;		
	border-left: dotted #000 1px;	
	border-right: dotted #000 1px;	
}

#harmadik {
	float: left;  	
	position: absolute; 				
	width: 405px;		
	min-height: 700px;				
}
#negyedik{			
	float:right;
	width:190px;
	border-left:dotted #000 1px;	
	min-height: 700px;			
}
<div id="kontener">
<div id="felso">
</div>
<div id="also">
<div id="elso">
Menü lesz itt
</div>
<div id="masodik">
<div id="harmadik">
Ide jönne a tartalom
</div>
<div id="negyedik">
                          Ide még dobozok jönnek.
</div>
</div>

</div>
</div>
 
1

IE

Nagy Péter · 2006. Jan. 9. (H), 16.13
Szia!

Gondolom Explorerben nézed. A min-height tulajdonságot ez a böngésző nem érti.

--
NP
2

Nem IE

Anonymous · 2006. Jan. 9. (H), 16.36
Szia.

Nem, ezt most Firefoxban néztem. De akkor mivel lehet ezt megoldani IE-ben?
3

Absolute

mefi · 2006. Jan. 9. (H), 19.57
Leginkább az absolute pozicionálás lehet a gond. Én a helyedben megpróbálnám relatív módon pozicionálni, vagy ha nagyon tekerni akarod, akkor el helyezed egy tároló divben, és a tárolónak muszály növekednie. Megpróbálhatod azt is, hogy beállítasz egy hátteret, ami ugye ismétlődik - a mérettől függetlenül - viszont ha a tartalmat is elrejti, akkor az egyértelműen absolute pozicionálás végett lehet. Próbáld meg relative módon, én ezt javaslom.

Az Internet Explorer kivédését többféleképpen lehet intézni. Általában az értelmesebb böngészőknél úgy működik, hogy a tároló divben (konténer) lévő divek szélességének összege egyenlő, a tároló div szélességével. IE-ben ez annyiban változik, hogy a bent lévő divek szélessége kissebb, mint a tárolóé. Javaslom még az overflow: hidden; tulajdonságot. Ha ezt használod, akkor nem fog szétesni a szerkezet, ha valami nagyobb, mint kéne.

üdv:
mefi
http://mefi.be
4

CSS - Clearing floats

wiktor · 2006. Jan. 9. (H), 21.53
Szerintem Te ezt keresed... :)
http://www.quirksmode.org/css/clearing.html