A div that tries to be 300px but is willing to compromise?

[MrKrinkle]

Here is what I want to say in CSS:

Dear div, please try to be 300px wide. If for some reason there's a
table inside of you that's 400 px wide, go ahead and expand to envelop
it, RATHER THAN A) holding your boundary and letting it spill over the
edge, B) cutting the table off at your edge, or C) making scrollbars.
In other words, act just like tables do in this situation by default.

How do I do that in a CSS class definition, that will work across major
browsers?

In other words, none of the options for "overflow" sound like what I
want. I'm about to give up and go back to tables why do I bother.

[Benjamin Niemann]

MrKrinkle wrote:

Here is what I want to say in CSS:

Dear div, please try to be 300px wide. If for some reason there's a
table inside of you that's 400 px wide, go ahead and expand to envelop
it, RATHER THAN A) holding your boundary and letting it spill over the
edge, B) cutting the table off at your edge, or C) making scrollbars.
In other words, act just like tables do in this situation by default.

How do I do that in a CSS class definition, that will work across major
browsers?

In other words, none of the options for "overflow" sound like what I
want. I'm about to give up and go back to tables why do I bother.

Would 'min-width' work the way you need it?
IE does not really support it, but the implementation of 'width' in IE is
broken too and works just like 'min-width' should do.
So a hack like:

yourSelector { min-width: XXX }
* html yourSelector { width: XXX }

could work for you.

--
Benjamin Niemann
Email: pink at odahoda dot de
WWW: http://www.odahoda.de/

[Bart]

Op 25 Jun 2005 18:52:28 -0700 schreef "MrKrinkle"
<yu******@hotmail.com>:

Here is what I want to say in CSS:

Dear div, please try to be 300px wide. If for some reason there's a
table inside of you that's 400 px wide, go ahead and expand to envelop
it, RATHER THAN A) holding your boundary and letting it spill over the
edge, B) cutting the table off at your edge, or C) making scrollbars.
In other words, act just like tables do in this situation by default.

How do I do that in a CSS class definition, that will work across major
browsers?

In other words, none of the options for "overflow" sound like what I
want. I'm about to give up and go back to tables why do I bother.

Use min-width: it sets the minimum width of an element (except
non-replaced inline elements and tables).
Problem is AFAIK that it's use is not very well supportd by IE...

Bart
--
Bart Broersma
br*********************@tiscali.nl
(ff _ANTISPAM_ wegpoetsen uit dit adres natuurlijk)

[Lauri Raittila]

in comp.infosystems.www.authoring.stylesheets, Benjamin Niemann wrote:

Dear div, please try to be 300px wide. If for some reason there's a
table inside of you that's 400 px wide, go ahead and expand to envelop
it,
How do I do that in a CSS class definition, that will work across major
browsers?

I'm about to give up and go back to tables why do I bother.
Would 'min-width' work the way you need it?
Propably
yourSelector { min-width: XXX }
* html yourSelector { width: XXX }

could work for you.

Setting display:table works as well, but bit differently: if the content
is table without width, it will be tried to put inside 300px, and only
streches it if that fails. IANM, that matches IE bug.

--
Lauri Raittila <http://www.iki.fi/lr> <http://www.iki.fi/zwak/fonts>
Kohtuuhintainen yksiö/huone haussa Oulusta syyskuusta eteenpäin.
Searching places to sleep on axis Bonn - Tsech - Poland - baltic sea in
july