<div> width?

[chiprivers]

I have a basic page layout of two <div>'s nestled side by side inside another <div>:

==================================================================
= <div id="page">                                                                                            =
=  ===================  =========================================  =
=  = <div id="left">          =  =  <div id="right"                                                  =  =
=  =                              =  =                                                                      =  =
=  =                              =  =                                                                      =  =
=  =                              =  =                                                                      =  =
=  =                              =  =                                                                      =  =
=  =                              =  =                                                                      =  =
=  ===================  ==========================================  =
=                                                                                                                    =
==================================================================

#page should be the whole width of the display area, #left should have its width set by its content and #right should take up the remaining width.

I have used the following CSS:

#page {
width: 100%; padding: 10px
}

#left {
float: left
}

#right{
float: right: width: 100%
}


But using this CSS it puts #right down below #left and sets its width to 100% of #page instead of just the remaining space nestled next to #left.  How can I get the desired result?

[Jtech]

Well either position it left rather that float it left

-----------------------
[code]
position:absolute;
margin-left:o;


[/code]
-----------------------

or  make it even like float left 30% and float right 70% or what eva why u want it . cause when rights = 100% it will push it below.


-----------------------Your script edited

[code]
#page {
width: 100%; padding: 10px
}

#left {
float: left;
width:30%;
}

#right{
float: right;
width: 70%
}
[/code]

[chiprivers]

I cant use percentages because the left div will contain a form which will always be a fixed width in pixels, the right hand div will contain a display of data which will always be a different size but I want the div to fill up the remaining space, irrespective of the window size.  (I intend to make this right div scrollable).

[ToonMariner]

just float the left div and give it a fixed width.

don't float the right div but give it a left margin a little more than the width of the left div.