Fri, 2007-01-12 12:45
Hi,
I'd like to make two columns, each 50% wide, inside a DIV. Yet I got no luck - the inside divs won't stay on the same level and the right one keeps getting below. Even if I put 49% some browsers (IE6) render it the wrong way.
The site: http://service.miejsca.org/
Style: http://service.miejsca.org/wp-content/themes/miejsca/style.css
Outside div: content
inside divs: content_left, content_right
#content{width:auto; z-index:1; position:relative; vertical-align:top; padding:0}
#content:after{content:"."; display:block; height:0; clear:both; visibility:hidden}
#content_left{float:left;width:49%;padding:0;margin:0}
#content_right{float:right; width:49%;padding:0; margin:0;background:#fff url(/media/main_back2.gif) top repeat-x}
I'll be very grateful for a solutions, since I spent literally hours/days trying to fix it by myself.
Fri, 2007-01-12 14:22
#1
Have to define a vertical location
You should be able to give them an absolute position and define their top as 0px. (this will be in relation to their parent div)
#content{
width:auto;
z-index:1;
position:relative;
vertical-align:top;
padding:0}
#content:after{
content:".";
display:block;
height:0;
clear:both;
visibility:hidden}
#content_left{
position:absolute;
top:0px;
left:0%;
width:49%;
padding:0;
margin:0
}
#content_right{
position:absolute;
top:0px;
right:0%;
width:49%;
padding:0;
margin:0;
background:#fff url(/media/main_back2.gif) top repeat-x
}
Fri, 2007-01-12 14:43
#2
Thank you - yet it doesn't
Thank you - yet it doesn't work on my side (in FF2 nor IE7): the content div just disappears.
Fri, 2007-01-12 15:04
#3
They need to have content in
They need to have content in them...Here is the whole HTML I was working with.
Untitled Document
#content{width:auto; z-index:1; position:relative; vertical-align:top; padding:0}
#content:after{content:"."; display:block; height:0; clear:both; visibility:hidden}
#content_left{
position:absolute;
top:0px;
left:0%;
width:50%;
padding:0;
margin:0;
background-color:#00FF00
}
#content_right{
position:absolute;
top:0px;
right:0%;
width:50%;
padding:0;
margin:0;
background-color:#FF0000
}
Stuff on the Left
Stuff on the Right
Fri, 2007-01-12 18:37
#4
Thank you very much for your
Thank you very much for your help!
Sat, 2007-01-13 14:56
#5
Did that fix the problem?
Did that fix the problem?