Problem z position:relative w Google Chrome?, IE i Firefox OK, a o co chromowi chodzi? Opcje

[f4ll3ns3raf1n]

Witam,
po krótce, poniżej zdjęcia tego, jak wygląda wyświetlenie strony na 3 przykładowych przeglądarkach:




zasadnicze pytanie: co chromik robi nie tak, że biało-niebieski DIV wchodzi na pomaranczowy sidebar?
jak to zniwelować?
poniżej zamieszczam 2 listingi:

[CSS] pobierz, plaintext 
	body { background: #f3f4df; font-family: verdana, tahoma; font-size: 12pt; color: black; }
	#pageBody { width: 1024px; }
 
	#header { height: 353px; margin-top: 47px; background: url('images/header_bg_gradient.jpg') repeat-x 0 84px; }
	#header #logo 	{ position: absolute; width: 266px; height: 219px; background: #4a7db9; margin: 0 0 0 16px; }
	#header #menu 	{ position: absolute; width: 734px; height:  63px; margin: 22px 0 0 290px; }	
	#header #image 	{ position: absolute; width: 742px; height: 269px; margin: 84px 0 0 282px; }
 
		#top_menu_list ul {  }
		#top_menu_list li { display: box; float: left; width: 142px; height: 62px; margin-left: 2px; }
			#top_menu_list #home 	{ background: #6633cc }
			#top_menu_list #o_firmie{ background: #006699 }
			#top_menu_list #oferta 	{ background: #cc6633 }
			#top_menu_list #sklep 	{ background: #669900 }
			#top_menu_list #kontakt { background: #ec8014 }
 
	#sidebar { position: absolute; width: 226px; margin: -62px 0 0 36px; border: #ff7801 solid; /**/height: 400px; }
 
	#content { width: 717px; position: relative; margin: 26px 0 0 272px; }
	#content #mp_topbox 	{ background: #bddef1; }
	#content #mp_bottombox 	{ background: white; }
 
	#footer 	{ height: 30px; background-color: #333399; color: white; font-size: 10px; }
	#footer a 	{ font-weight: bold; color: white; }
[CSS] pobierz, plaintext 

[HTML] pobierz, plaintext 
<center><div id="pageBody">
<div id="header">
	<div id="logo">LOGO</div>
	<div id="menu">
		<ul id="top_menu_list">
			<li id="home">Home</li>
			<li id="o_firmie">O firmie</li>
			<li id="oferta">Oferta</li>
			<li id="sklep">Sklep</li>
			<li id="kontakt">Kontakt</li>
		</ul>
	</div>
	<div id="image">Image</div>
</div>
<div id="sidebar">
	SIDEBAR<?php // get_sidebar(); ?>
</div>
<div id="content">
	<div id="mp_topbox">Witajcie na naszej stronie</div>
	<div id="mp_bottombox">W naszej ofercie ujrzycie panstwo</div>
</div>
<div class="clr"></div>
<div id="footer">FOOTER<?php get_footer(); ?></div>
</div></center>
[HTML] pobierz, plaintext 

DIV Content ma być ze zmienną wysokością, która zawsze będzie przewyższać sidebar, dlatego nie może to być position: absolute;
czy ma ktoś jakiś pomysł, jak to rozwiązać?
przykład strony tutaj: http://uslugi-dekarskie.one.pl/

Ten post edytował f4ll3ns3raf1n 23.01.2011, 02:40:01

[gigzorr]

za duzo position:absolute,relative zacznij uzywac floatow i clearowania bo pod kazda bedzie zle.

[f4ll3ns3raf1n]

rzeczywiście proste rozwiązanie :-)

[CSS] pobierz, plaintext 
#content { width: 717px; float:right ; margin: 26px 29px 0 272px; }
[CSS] pobierz, plaintext 

wczoraj najwidoczniej nie była pora na kodzenie, serdeczne dzięki!