4 replies to this topic

[pinstripe05]

I am wondering if someone can give a helping hand . I am creating a website and want to have 3 content areas aside from the footer and header.
This is what I have for the 3 sections of my different contents. The page layout is 1000px in width. The problem I am having is that my “right side bar”, when you shrink the browser page (reduce the maximum size) and drag it to the left, the right bar starts to over lap the main content and the left side bar. Any suggestions to keep it in place?
Left side bar:
#content #leftbar {
float: left;
width: 180px;
padding-left: 5px;
}
Right side bar:
#content #rightbar {
float: right;
width: 205px;
padding-bottom: 5px;
}
Main content:
#content #picture {
padding-top: 20px;
width: 598px;
position: relative;
float: left;
margin-right: 5px;
margin-left: 5px;
}

[gokuajmes]

i need to have a look at whole markup . HTML + CSS.:p

[CommittedC0der]

I haven't played with HTML in a while, but could you use padding, like padding-right or margin? :P Or you could use: "position:absolute;" then move the area around with the properties(e.g top:50px; right:50px; left:50px; bottom:50;) but Im not sure if thats what your wanting.

Anyway, Hope I helped. :)

[zeroradius]

the easiest way is to set the left margin of whatever you are floating right so that it is bigger than the item on the left. Thats how I do mine so they don't overlap

[oldhendra]

Probably wrap the 3 div into a div,
and set this div width to 1000px?