469,280 Members | 1,959 Online
Bytes | Developer Community
New Post

Home Posts Topics Members FAQ

Post your question to a community of 469,280 developers. It's quick & easy.

How to set the total width of an element ?


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
Jul 20 '05 #1
2 2183
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/
Jul 20 '05 #2
Brian wrote:
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?


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
Jul 20 '05 #3

This discussion thread is closed

Replies have been disabled for this discussion.

Similar topics

14 posts views Thread by delerious | last post: by
4 posts views Thread by mike eli | last post: by
10 posts views Thread by giancarlodirisioster | last post: by
1 post views Thread by CARIGAR | last post: by
reply views Thread by zhoujie | last post: by
By using this site, you agree to our Privacy Policy and Terms of Use.