Mam problem, otóż próbuję pociąc design pod div'y ale idzie mi to ostatnio pod górkę. Najlepiej najpierw to zobrazuję (sory za jaskawe kolory, ale na oryginalnych obrazkach nie widać):



Pierwszy prostokat (oddzielone są 1pikselową czarną kreską tongue.gif) to wyświetlanie z FF 2.0.0.13, drugi jest z Opery 9.24, a trzeci z IE7. Kod prezentuje się następująco
[HTML] pobierz, plaintext 
  1. <body>
  2.     <div class="main">
  3.         <div class="center">ABC
  4.             <div class="header_01">X</div>
  5.             <div class="header_02">Y</div>
  6.             <div class="header_03">Z</div>
  7.         </div>
  8.     </div>
  9. </body>
[HTML] pobierz, plaintext


Kod z style.css
[HTML] pobierz, plaintext 
  1. body {
  2. 	  background-color: #FFFFFF;
  3. 	  background-image: url('images/background.gif');
  4. 	  background-repeat: repeat-x;
  5. 	  padding: 0px;
  6. 	  margin: 0px;
  7. 	  font-size: 10px;
  8. 	  font-family: Tahoma, Helvetica;
  9. }
  10.  
  11. div.main {
  12. 	width: 960px;
  13. 	text-align: center;
  14. 	margin: auto;
  15. 	/*background-color: #F2F2F2;*/
  16. 	background-color: #FFFF00;
  17. 	/*background-image: url('images/background_02.gif');*/
  18. 	background-repeat: repeat-x;
  19. }
  20.  
  21. div.center {
  22. 	width: 950px;
  23. 	margin: auto;
  24. 	text-align: justify;
  25. 	border: 1px solid #d9d9d9;
  26. 	background-color: #FFF;
  27. }
  28.  
  29. div.header_01 {
  30. 	width: 476px;
  31. 	height: 139px;
  32. 	margin: auto;
  33. 	background-color: #FF0000;
  34. 	/*background-image: url('images/header_01.jpg');*/
  35. 	background-repeat: no-repeat;
  36. 	float: left; 
  37. }
  38.  
  39. div.header_02 {
  40.         width: 270px;
  41. 	height: 139px;
  42. 	margin: auto;
  43. 	background-color: #00FF00;
  44. 	/*background-image: url('images/header_02_01.jpg');*/
  45. 	background-repeat: no-repeat;
  46. 	float: left;
  47. }
  48.  
  49. div.header_03 {
  50. 	width: 204px;
  51. 	height: 139px;
  52. 	margin: auto;
  53. 	background-color: #0000FF;
  54. 	/*background-image: url('images/header_03.jpg');*/
  55. 	background-repeat: no-repeat;
  56. 	float: left; 
  57. }
[HTML] pobierz, plaintext


Teraz do sedna. Co spie.szylem w tym kodzie, że tak się dzieje? Chce aby wszystko wyświetlało się tak jak pod IE7 czyli żółte paski po bokach na wysokości trzech blokach w RGB. Mam nadzieję, że problem jasno opisany dlatego liczę na rzeczowe odpowiedzi.

edit
Ok już prawie jest, dorzuciłem overflow: hidden; w mainie i <br style="clear: both"/> pod tymi trzema divami. Ale pod operą tekst ABC dalej jest nad niebieskim kwadratem i "wypycha" go w doł :|