Hi everyone,
I am new here.
I have a question about div columns and its width.
I have 3 divs:
#pane_left{
width: 120px;
float: left;
margin: 0px;
}
#pane_main{
padding-right: 11px;
padding-left: 11px;
margin-bottom: 30px;
margin-top: 0px;
position: relative;
width: 300px;
float: left;
}
#pane_right{
width: 124px;
float: left;
}
Sometimes #pane_left and/or #pane_right is empty and then I want to stretch #pane_main as it can.
Does anyone hava idea?
3 columns and width
Don't give pane main a width. If it has a width, it'll always be that width. An empty div won't be displayed, so you shouldn't have to do anything, except make sure you float the right hand pane, right and put the content of pane_main after the two floated panes. You can give pane_main a style of overflow:hidden for good measure.
e.g. sample
btw, using pane_left and pane_right is not the best. Name them after the content that goes in them. Then if you decide to move them somewhere else the ids will still be relevant.
/edit, you might need some extras to overcome IE's eccentricities - giving a div some small height and space when its empty.
3 columns and width
Thank you Chris.
I have made changes as you told me and it works fine.