minimum height

#1

I have some divs (float: left) that I'd like to set a minimum height
on. What's the level of support on min-height and are there any bugs I
need to watch out for.

I've never used this, and I have some memory of there being a problem
with it somewhere.

Jeff

#2

Jeff wrote:

Quote:

I have some divs (float: left) that I'd like to set a minimum height
on. What's the level of support on min-height and are there any bugs I
need to watch out for.

I've never used this, and I have some memory of there being a
problem with it somewhere.

Jeff

Either firefox or internet explorer (I thinkt the latter) does not support
it. I would add an image (or a div within the div) with width 1px and
height your min-height.

Quote:

Nicolaas

#3

Jeff <dont_bug_me (AT) all (DOT) uk> wrote:

Quote:

I have some divs (float: left) that I'd like to set a minimum height
on. What's the level of support on min-height and are there any bugs I
need to watch out for.

IE doesn't support it, but it treats "height" as min-height, so a cross
browser min-height solution is:

..YourClass{min-height:10em;height:10em}
*>.YourClass{height:auto}

--
Spartanicus

#4

Spartanicus wrote:

Glad to see you are still hanging out here.

Quote:

Jeff <dont_bug_me (AT) all (DOT) uk> wrote:

I have some divs (float: left) that I'd like to set a minimum height
on. What's the level of support on min-height and are there any bugs I
need to watch out for.

IE doesn't support it, but it treats "height" as min-height, so a cross
browser min-height solution is:

.YourClass{min-height:10em;height:10em}
*>.YourClass{height:auto}

*> that is something I haven't used either. I don't even know what to
call it! Let me know so I can google it.

Cheers,
Jeff

#5

Jeff wrote:

Quote:

.YourClass{min-height:10em;height:10em}
*>.YourClass{height:auto}

*> that is something I haven't used either. I don't even know what to
call it! Let me know so I can google it.

"*" is the universal selector; it applies to all objects.

">" is the child selector.
Put together it means "for a child of any object" apply this style.
It is not supported by IE6 and earlier so is ignored. IE also ignores
min-height:10em leaving a net style of height:10em, which it incorrectly
treats as min-height.
Modern browsers recognize " * > " and apply the style overriding the
height:10em previously specified.
(Isn't this fun? Yee haw!)

--
jmm (hyphen) list (at) sohnen-moe (dot) com
(Remove .AXSPAMGN for email)

#6

Jim Moe <jmm-list.AXSPAMGN (AT) sohnen-moe (DOT) com> wrote:

Quote:

"*" is the universal selector; it applies to all objects.

It matches any *element*.

--
Spartanicus

#7

Quote:

.YourClass{min-height:10em;height:10em}
*>.YourClass{height:auto}

*> that is something I haven't used either. I don't even know what to
call it! Let me know so I can google it.

is the child selector which IE doesn't support
* is a wildcard.

--

Bye.
Jasen

#8

Jim Moe wrote:

Quote:

"*" is the universal selector; it applies to all objects.
">" is the child selector.
Put together it means "for a child of any object" apply this style.

Wouldn't that pretty much mean every object, except the <body>?

#9

Spartanicus wrote:

Quote:

"*" is the universal selector; it applies to all objects.
">" is the child selector.
Put together it means "for a child of any object" apply this style.

Hold on, the example I provided uses a class as well. I used "*" since
that would allow the OP to use the code example by only changing the
class name. Using "*" also means that the CSS code will survive a change
in the markup (bar a class name change).

Ah! So it is better phrased as "an element that is a child of any

element and uses .YourClass"?

--
jmm (hyphen) list (at) sohnen-moe (dot) com
(Remove .AXSPAMGN for email)

#10

Jim Moe wrote:

Quote:

Spartanicus wrote:

"*" is the universal selector; it applies to all objects.
">" is the child selector.
Put together it means "for a child of any object" apply this style.

Hold on, the example I provided uses a class as well. I used "*" since
that would allow the OP to use the code example by only changing the
class name. Using "*" also means that the CSS code will survive a change
in the markup (bar a class name change).

Ah! So it is better phrased as "an element that is a child of any
element and uses .YourClass"?

In an off hand way, that makes perfect sense. Thanks to all.

I use descendants quite a bit.

#some_container p{...

Am I correct in assuming that the child selector works the same way,
except that it must be a "first order descendant"?

#some_container > p{...

<div id="some_container">
<p>styled</p>
<p>also styled</p>
<div><p>not styled by that child selector</p></div>
....

Cheers,
Jeff

Thread Tools
Show Printable Version Email this Page
Display Modes
Linear Mode Switch to Hybrid Mode Switch to Threaded Mode

minimum height

Cascading Style Sheets Layout/presentation on the WWW (comp.infosystems.www.authoring.stylesheets)

minimum height - 03-23-2006 , 11:21 AM

Re: minimum height - 03-23-2006 , 02:16 PM

Re: minimum height - 03-23-2006 , 03:36 PM

Re: minimum height - 03-23-2006 , 11:22 PM

Re: minimum height - 03-24-2006 , 12:56 AM

Re: minimum height - 03-24-2006 , 03:32 AM

Re: minimum height - 03-24-2006 , 05:30 AM

Re: minimum height - 03-24-2006 , 12:02 PM

Re: minimum height - 03-25-2006 , 02:36 PM

Re: minimum height - 03-26-2006 , 11:07 PM