make a div use maximum width

08-21-2007

Hi,
I want the green piece ("Please be wide") to fill the whole space
between the red and the blue thingy. How can I do that?

Thank you in advice,
-Gernot

PS: My code is as minimal as possible, I know I should use strict-html
and stuff.

<html>
<body>
<div style="width:50%;">

<div style="float:left; width:16px; background-color:Red;"></div>


<div style="float:left; background-color:green;">Please be wide</div>

<div style="float:right; width:16px; background-color:blue;"></div>
</div>
</body>
</html>

08-21-2007

Well bust mah britches and call me cheeky, on Tue, 21 Aug 2007 08:49:07 GMT
Gernot Frisch scribed:

>
> Hi,
> I want the green piece ("Please be wide") to fill the whole space
> between the red and the blue thingy. How can I do that?
>
> Thank you in advice,
> -Gernot
>
> PS: My code is as minimal as possible, I know I should use strict-html
> and stuff.
>
>
> <html>
> <body>
> <div style="width:50%;">
> 
> <div style="float:left; width:16px; background-color:Red;"></div>
>
> 
> <div style="float:left; background-color:green;">Please be wide</div>
> 
> <div style="float:right; width:16px; background-color:blue;"></div>
> </div>
> </body>
> </html>

Put a   after <div style="width:50%;">

--
Neredbojias
Half lies are worth twice as much as whole lies.

08-21-2007

>
> Put a   after <div style="width:50%;">

No. Neither in IE6, nor in FF.

08-22-2007

On Tue, 21 Aug 2007 10:49:07 +0200, "Gernot Frisch" <>
wrote:
>I want the green piece ("Please be wide") to fill the whole space
>between the red and the blue thingy. How can I do that?

This is because the centre DIV isn't given a width.

><html>
><body>
><div style="width:50%;">
> 
> <div style="float:left; width:16px; background-color:Red;"></div>
>
> 
> <div style="float:left; background-color:green;">Please be wide</div>
> 
> <div style="float:right; width:16px; background-color:blue;"></div>
></div>
></body>
></html>

One solution may be to wrap the left, centre and right DIVs into an
additional DIV, and give that a green background colour:

<html>
<body>
<div style="width:50%;">

<div style="background-color: green; float: left;">


<div style="float:left; width:16px; background-color:Red;"></div>

<div style="float:left; background-color:green;">Please be wide</div>

<div style="float:right; width:16px; background-color:blue;"></div>
</div>

</div>

</body>
</html>
--
Martin Jay

08-22-2007

> One solution may be to wrap the left, centre and right DIVs into an
> additional DIV, and give that a green background colour:

Perfect! That's the way to do it.

Similar Threads
Thread	Thread Starter	Forum	Replies	Last Post
<div ... /> and <div ...></div>	K Viltersten	ASP .Net	4	03-31-2009 07:33 PM
two div in one line, first div's width is const and the second isn't	tomek milewski	HTML	6	06-25-2007 09:28 PM
set div width to remaining width of the browser	Steve Richter	ASP .Net	2	06-15-2007 06:40 PM
how to: div width = browser.width?	=?Utf-8?B?cm9kY2hhcg==?=	ASP .Net	3	10-30-2006 05:43 AM
Textbox width scaling to width of data not width of page?	AndrewF	ASP .Net	1	10-10-2005 04:38 PM