IE has a quite strange way of doing things. It doesn't recognize the
min-width and min-height commands, but instead interprets width and
height as min-width and min-height
This can cause problems, because we may need boxes to be resizable
should we need to fit more text into them, or should the user resize
the text. If we use only the width and height commands on a box, non-
IE browsers won't allow the box to resize. If we only use the min-
width and min-height commands, though, we can't control the width or
height in IE!
This can be especially problematic when using background images. If
you're using a background image that's 80px wide and 35px high, you'll
want to make sure that the default size for a box using this image is
exactly 80 x 35px. However, if users resize the text, the box size
will need to expand gracefully.
To resolve this problem, you can use the following code for a box with
class="box":
.box
{
width: 80px;
height: 35px;
}
html>body .box
{
width: auto;
height: auto;
min-width: 80px;
min-height: 35px;
}
All browsers will read through the first CSS rule, but IE will ignore
the second rule because it makes use of the child selector command.
Non-IE browsers will read through the second one, which will override
the values from the first rule, because this CSS rule is more
specific, and CSS rules that are more specific always override those
that are less specific.
http://designwebsite.wordpress.com
--~--~---------~--~----~------------~-------~--~----~
--
You received this because you are subscribed to the "Design the Web with CSS"
at Google groups.
To post: [email protected]
To unsubscribe: [EMAIL PROTECTED]
-~----------~----~----~----~------~----~------~--~---
