CSS- Fill remaining width of page with a fixed position DIV

Posted in dotnet, vb, vb.net | No Comments »

Hi,

I have a DIV in a fixed position on the bottom of a page which is 354px from the left.
I need the DIV to fill the remaining width of the page. How can I do this? Thanks

Take a look at the image…

http://www.freeimagehosting.net/uploads/a1b6e2946e.gif

Edit

  <html>

    <head>
    <style type="text/css">
    body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, textarea, p, blockquote, th, td
    {
        margin: 0;
        padding: 0;
    }

#Container{
width:100%;
height:100%;
background-color:gray;}

#sidebar{
width:354px;
height:100%;
position:fixed;
left:0px;
top:0px;
background-color:orange;}

#toolbar{
height:40px;
width:100%;
position:fixed;
bottom:0px;
margin-left:354px;
background-color:blue;
text-align:right;color:white}

</style>

    </head>

    <body>
    <div id="container">
    <div id="sidebar"></div>
    <div id="toolbar">
    Demo text
    </div>
    </div>
    </body>

</html>

Similar:

  1. Creating 3-col layout with fixed-width middle column? The following page has a left and right column with fixed width, and the middle column takes up the remaining space. I'd like to have...
  2. min-width, max-width, width. Nothing work in IE8 on body tag Hello, This is my web page which doesn’t work in IE8 but works in FF 3.6.4 and Opera 9.63 :- <html> <head> <style type="text/css"> body{...
  3. Is there an ideal width for a header image in a fluid layout? I have read about issues with a liquid layout like the banner image size e.g if the window size is very big and the image...
  4. Need help 3-col website: 1 fixed, 2 fluid Hi. I am making a website with 3 collumns. The left one is fixed (250px) and i want the other 2 to be fluid. The...
  5. Browser Side Scroll With No Set Width & No Anchors…? I have the following html and css. A list populates with images and sits horizontally expanding the width depending on the content, this could be...

Leave a Reply