Solution to the problem that max-width and min-height are not supported by IE6

Today I will bring you a solution to the problem that max-width and min-height are not supported by IE6.

We often set the minimum height of a page to achieve beautiful display even when the content of the entire page is not enriched. Sometimes when setting the maximum width of the image without exceeding the set width, we can set a minimum height using min- height, and set the maximum width limit using the max-width CSS attribute. But the problem is that IE7 and above versions support it, but only IE6 does not support min-height, MAX-height, max-width, min-width. What should I do?

DIVCSS5 introduces a solution using css hack. As we all know, generally we set the width or height of the object. If the picture or content is larger than the set width, IE6 will break the set width and height. This is what we can do Use this and IE6's unique CSS recognition to match "_" to solve the problem

For example, we need to set a minimum height of 500px for a web page to look good, but what should we do if IE6 does not support it?
We just use CSS properties to read from left to right and replace the bottom and right CSS property values ​​with repeated properties from top to bottom.

The specific CSS code is as follows:

.div{min-height:500px;_height:500px;}

Note: Be sure to pay attention to the order. The former is supported by all IE, Firefox, and Google in IE7 and above, while the latter is only supported by IE6, so it is just right to take advantage of it. This CSS HACK and CSS read order solve this problem.

Of course, there is also the following CSS code:

.div{height: expression(this.height> 500 ? 500 : true);  max-height: 500px;}

However, this CSS code will cause the image to not be displayed normally after loading (the image will be randomly reduced and cannot be displayed normally)

So we recommend using min-height:500px;_height:500px; to solve the problem of IE6 not being able to use max and min attributes.

# I believe you have mastered the methods after reading these cases. For more exciting information, please pay attention to other related articles on the php Chinese website!

Related reading:

Answers to questions about camel case naming and JS

Boolean values, relational operators in JS, Detailed explanation and examples of logical operators

## Summary of the front-end js framework and explanation of its uses

The above is the detailed content of Solution to the problem that max-width and min-height are not supported by IE6. For more information, please follow other related articles on the PHP Chinese website!