View Full Version : DIV's Align problem

05-13-2010, 05:08 PM
hello all
i have problem in 2 DIV's alignment

i have 3 DIV's
1 is like main frame centered, holding other 2 (left and right DIV)
next to each other

problem is, that Opera align's them proper, while Firefox and Iron do not

here are pictures (1st Opera, 2nd FF/Iron)



code follows

* {
margin: 0;
padding: 0;
border: none;

* html, body, .main_frame, .right_frame {
height: 100%;

.main_frame {
min-height: 99%;
width: 980px;
left: 5px;
margin: 0 auto;
z-index: 1;

.right_frame {
min-height: 90%;
margin-top: 10px;
margin-left: 250px;
padding-left: 15px;
padding-right: 15px;
height: 600px;
z-index: 1;

.left_frame {
width: 210px;
margin-top: 10px;
padding-left: 15px;
float: left;
position: fixed;
z-index: 1;

both left and right DIV have margin-top: 10px property
so they should be same aligned, to be flat (as Opera renders)

can anyone explain why this happens ?
any easy workaround without breaking all 3 browser views ?

05-13-2010, 05:15 PM
here are pictures (1st Opera, 2nd FF/Iron) We can't decode a picture to produce the corresponding html. Please post your complete html (including DOCTYPE ) or a link to your page would be much better.

05-13-2010, 05:24 PM
ok sorry

heres link http://volja.hr/dmakriev/test/index.html

you can see the top not aligned in FF/Iron
theres like ~5px difference in height

05-13-2010, 05:33 PM
if you apply overflow: hidden to the main_frame class it will move the boxes to be aligned.

05-13-2010, 05:41 PM
sweet it work nicely
thank you so very much !

that thing bugged me for long time :)