The best way to do this would be to "float" each div inside your container.
This will allow them to line up horizontally. The CSS may look like this.
#Box1 {
float: left;
width: xxx;
}
#Box2 {
float: left;
width: xxx;
}
#Box3 {
float: left;
width: xxx;
}
#Box4 {
float: left;
width: xxx;
}
#Box5 {
float: left;
width: xxx;
}
Keep in mind that if you have any content appearing below your 5 divs you
will need to "clear" that content in order to display below them. It would
look something like this.
#footer {
clear: left;
}
Hope this helps.
--
Daniel
On 5/3/06 9:18 AM, "Brian Jones" <[EMAIL PROTECTED]> wrote:
> Hi,
>
> I am trying to create a small 5 column CSS box that will render
> correctly across browsers.
> Also I would like to be able to adjust the widths of each box accordingly
>
> I am looking for something like this:
>
> <div id="container">
> <div id="Box1">Text </div>
> <div id="Box2">Text </div>
> <div id="Box3">Text </div>
> <div id="Box4">Text </div>
> <div id="Box5">Text </div>
> </div>
> _________ _________ _________ _________ _________
> |__Box 1 _||__Box 2 _| |__Box 3 _| |__Box 4 _| |__Box 5 _|
>
> Any help would be greatly appreciated.
>
> Thank you
> ______________________________________________________________________
> css-discuss [EMAIL PROTECTED]
> http://www.css-discuss.org/mailman/listinfo/css-d
> IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
> List wiki/FAQ -- http://css-discuss.incutio.com/
> Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
______________________________________________________________________
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
