Stylesheets - How to set the total width of an element ?

Author

How to set the total width of an element ?

Timothy Madden

2004-07-17, 7:16 pm

Hello

Is it possible with CSS to have a DIV for wich the total (content-width +
padding + border) to be say 150px and for wich to have a 2ex padding and a
1px border ?

I need this since I have a background image wich is not a repeating pattern
so my DIV must be exaclty as wide as the image, including padding and
borders.

--
Thank you
Timothy Madden
Romania
---------------------------
And I don't wanna miss a thing

Brian

2004-07-17, 7:16 pm

Timothy Madden wrote:

> Is it possible with CSS to have a DIV for wich the total (content-width +
> padding + border) to be say 150px and for wich to have a 2ex padding and a
> 1px border ?

Yes, if you don't mind a tad of div soup:

<DIV CLASS="foo">
<DIV>
here's my text, behind which will be a nifty
background-image that will not repeat
</DIV>
</DIV>

DIV.foo {
width: 150px; /* warning: fixed width for text container! */
}

DIV.foo DIV {
border: 1px solid #808080;
padding: 2ex;
}

Tested in Firefox. Should work elsewhere, but who knows with MSIE/Win?

--
Brian (remove ".invalid" to email me)
http://www.tsmchughs.com/

Timothy Madden

2004-07-17, 11:15 pm

Brian wrote:

> Timothy Madden wrote:
>
>
> Yes, if you don't mind a tad of div soup:
>
> <DIV CLASS="foo">
> <DIV>
> here's my text, behind which will be a nifty
> background-image that will not repeat
> </DIV>
> </DIV>
>
>
> DIV.foo {
> width: 150px; /* warning: fixed width for text container! */
> }
>
> DIV.foo DIV {
> border: 1px solid #808080;
> padding: 2ex;
> }
>
> Tested in Firefox. Should work elsewhere, but who knows with MSIE/Win?

Thank you. I see now. Indeed it is possible.
I needed this several times and never thought about it this way ...
--
Timothy Madden
Romania
-------------------------
And I don't wanna miss a thing