Detailed explanation of how to control the maximum width/height and minimum width/height of div using CSS

高洛峰
Release: 2017-03-17 14:25:37
Original
1861 people have browsed it

In web page production it is often necessary to control the p width, maximum width/height or minimum width/height, but in IE6 many friends will encounter incompatibility headaches, including I often encounter this problem. I searched a lot on Baidu but couldn't solve it. Later I learned about it on a forum. I will share with you the css3 style code. Time is fully compatible with all major mainstream browsers.


* Minimum width*/

.min_width{min-width:300px;
/* sets max-width for IE */
_width:expression(document .body.clientWidth < 300 ? "300px" : "auto");
}

/* Maximum width*/
.max_width{
max-width:600px;
/* sets max-width for IE */
_width:expression(document.body.clientWidth > 600 ? "600px" : "auto");
}

/* Minimum height */
.min_height{
min-height:200px;
/* sets min-height for IE */
_height:expression(this.scrollHeight < 200 ? "200px" : "auto ");
}

/* Maximum height*/
.max_height{
max-height:400px;
/* sets max-height for IE */
_height:expression(this.scrollHeight > 400 ? "400px" : "auto");
}

/* Maximum and minimum width*/
.min_and_max_width{
min-width:300px;
max-width:600px;
/* sets min-width & max-width for IE */
_width: expression(
document.body.clientWidth < ; 300 ? "300px" :
                                                                                                                    use using using               ‐ ‐ ‐ ‐‐ ‐‐ ‐‐ ( document.body.clientWidth > 600 ? ? "600px" : "auto")
                                       
.min_and_max_height{
min-height:200px;
max-height:400px;
/* sets min-height & max-height for IE */
_height: expression(
this.scrollHeight < 200 ? "200px" :
( this.scrollHeight > 400 ? "400px" : "auto")
);
}

The above is the detailed content of Detailed explanation of how to control the maximum width/height and minimum width/height of div using CSS. For more information, please follow other related articles on the PHP Chinese website!

Related labels:
css
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template