javascript123456
Technical User
I am trying to make some divs arranged look like the picture attached
[*]div container has flexible width
[*]divA and divC has fixed width and located at two sides of the window,
[*]divB stays between divA and divC and fill the empty space between them
[*]divA, divB and divC must be at the bottom of the div container
finally,
[*] there is divD (orange area), it is overlaped on divB, in the middle of div container
the following code is what i am working now, but cant work well
/////////////////////////////////////////////////////////////////
#div_container{
position:relative;
height:300px;
}
#divD{
width:500px;
height:300px;
position:absolute;
margin: auto;
left:0; right:0;
}
#divABC{
height:30px;
clear:both;
}
#divA{
width:100px;
height:30px;
float:left;
}
#divC{
width:100px;
height:30px;
float:right;
}
#divB{
height:30px;
margin-left:100px;
margin-right:100px;
}