在制作网页中,我们经常会碰到min/max-width,min/max-height在IE6底下是无效的,这也是web设计师最头疼的问题之一,以下的方法可以解决这些难题,并且比较简约。当然,如果你还有更好的方法,希望能在主页留言给我:
<div style="max-width:250px;">这段文字内容,ax /min 在ie7 + 和firfox,safari,opera浏览器下均支持,最宽值为250px</div>不过IE6无法认读这个属性,还好IE它支持自己javascript的属性表达,例如:
div{width:expression_r(250+"px")} 和 div{widt:250px}在IE 的认读中都是一致的!但如果有的用户在浏览器中禁用javascript,这个写法就失败了。所以,需要换一种方法: 
#mycss {
width:100%; 
 max-width:500px;
width:expression_r(document.body.clientWidth > 500? "500px": "auto" ); }

或是:
#mycss {
max-width: 33em;
width: expression_r(document.body.clientWidth > (500/12) * parseInt(document.body.currentStyle.fontSize) ? "33em" : "auto" );
}

我们设置了容器mycss的宽度为:width:100%; 其实这是一句废话,因为DIV是块元素,默认的宽度就是父级元素的宽度。此例中div宽度,若不进行声明则等同于body的宽度。
我们设置容器的max-width为500px。这对于FF来说是有效的。而对于IE则没有作用。
  面对没有效果的IE,我们应用expression_r嵌入脚本,声明了当宽度大于500px的时候,宽度就等于500px。

parseInt(document.body.currentStyle.fontSize)?"33em":"auto" 如果这个实际宽度大于 (500/12)当前字体的尺寸,则设置页面的宽度为 33em。

同样,对于最小的宽度,和ax/min-hight,也是一样的:
最小:
#mycss {
min-width: 333px;
width: expression_r( document.body.clientWidth < 334 ? "333px" : "auto" );
}

最大高度:

#mycss {
max-height: 333px;

height: expression_r( this.scrollHeight > 332 ? "333px" : "auto" )
}
最小高度:

#mycss {

min-height: 333px;

height: expression_r( this.scrollHeight < 334 ? "333px" : "auto" );
}

另外还有一种简单的方法:

#a {height:auto !important; min-height:400px;}
这个样式可以在IE5.5,IE6,IE7以及FF,Safari等浏览器下的解决最小高度问题,最大高度就没有实践过了,呵呵。

本文转自:http://www.cnblogs.com/hnyei/archive/2011/09/19/2181367.html

DIV+CSS兼容解决DIV最大宽度和最小宽度问题的更多相关文章

  1. DIV+CSS布局问题:一个宽度不确定的DIV里面放三个水平对齐的DIV,左右两个DIV宽度固定为150px,中间那个DIV充满剩余的宽度

    一个入门的DIV+CSS布局问题:一个宽度不确定的DIV里面放三个水平对齐的DIV,左右两个DIV宽度固定为150px,中间那个DIV充满剩余的宽度. 说明:代码非真实情况下使用,所以直接简单. 没耐 ...

  2. div+css兼容 ie6_ie7_ie8_ie9_ie10和FireFox_Chrome等浏览器方法

    1.div的垂直居中问题 vertical-align:middle; 将行距增加到和整个DIV一样高 line-height:200px; 然后插入文字,就垂直居中了.缺点是要控制内容不要换行   ...

  3. DIV+CSS常见问题:DIV如何设置一个像素高度?

    CSS如何控制DIV实现1像素高度呢?问题看起来很简单,但万恶的IE6会让你很麻烦,不过解决办法很多,本文将介绍最简单的一种:DIV{height:1px;line-height:1px;font-s ...

  4. CSS学习笔记--Div+Css布局(div+span以及盒模型)

    1.DIV与SPAN 1.1简介 1.DIV和SPAN在整个HTML标记中,没有任何意义,他们的存在就是为了应用CSS样式 2.DIV和span的区别在与,span是内联元素,div是块级元素 内联元 ...

  5. div+css:两个div并排等高 (table-cell)

    两个div并排等高 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> < ...

  6. div+css实现圆形div以及带箭头提示框效果

    .img{ width:90px; height:90px; border-radius:45px; margin:0 40%; border:solid rgb(100,100,100) 1px;& ...

  7. CSS 兼容解决之hack

    什么是CSS hack 由于不同的浏览器,甚至同一浏览器的不同版本对CSS的解析认识不一样,导致生成的页面效果不一致,写出针对不同浏览器CSS code就称为CSS hack. 常用的CSS hack ...

  8. 2天驾驭DIV+CSS (实战篇)(转)

     这是去年看到的一片文章,感觉在我的学习中,有不少的影响.于是把它分享给想很快了解css的兄弟们.本文是实战篇. 基础篇[知识一] “DIV+CSS” 的叫法是不准确的[知识二] “DIV+CSS” ...

  9. div+css布局记扎

    实际开发网站过程中边碰壁边积累了一些div+css布局相关的小技巧,在这里做一些整理与大家一起探讨.本文章将间歇性更新. 1.div+css布局综述 div+css布局个人观点就是“盒子套盒子”的关系 ...

随机推荐

  1. linux下串口工具minicom

    系统环境:ubuntu  14 .04  和ubuntu 16.04 我当时的需要主要是两个,能够看到正常串口输出,并且把串口内容实时输出到文件中 那接下来工作主要是两个:1.安装 2.配置 相信各位 ...

  2. API接口规范

    协议 API与用户的通信协议,总是使用HTTPs协议,确保交互数据的传输安全. 域名 应该尽量将API部署在专用域名之下. https://api.example.com 如果确定API很简单,不会有 ...

  3. vc2010 属性值无效 灾难性故障 解决方法

    原文链接: http://blog.csdn.net/enterlly/article/details/8739281 说明: 我遇到这个问题是这样的,在为某个类添加消息时出现的.因为该类不在此工程的 ...

  4. mysql查询今天、昨天、本周、本月、上一月 、今年数据

    mysql数据库中的关于查询日期的一些操作如下: --今天 select * from 表名 where to_days(时间字段名) = to_days(now()); --昨天 --本周 SELE ...

  5. Atitit 面试问题总结

    Atitit 面试问题总结 1. 面试约人阶段可以预先1俩分钟大概问下情况1 2. 自我介绍阶段1 3. 技术方面2 3.1. 界面方面2 3.2. Java 本身   了解spring mybati ...

  6. ISE中的Force Process Up-to-Date功能:ISE中如何在未综合实现的前提下打开ChipScope ?

    ISE中如何在未综合实现的前提下双击Analyze Design Using ChipScope打开ChipScope ? 有时,你正在ISE中调试程序,在ChipScope中看到了现象,顺手修改了程 ...

  7. 【Unity】第8章 GUI开发

    分类:Unity.C#.VS2015 创建日期:2016-04-27 一.简介 前面的章节中实际上已经多次使用了GUI,只不过用法都比较简单,这一章系统地介绍Unity 5.x自带的GUI(称为Uni ...

  8. iOS编程中比较两个日期的大小

    转自:http://www.myext.cn/other/a_30922.html 比较日期大小是任何编程语言都会经常遇到的问题,再iOS编程中,通常用NSDate对象来存储一个时间(包括日期和时间. ...

  9. 如何正确的重写equals() 和 hashCode()方法

    比较两个Java对象时, 我们需要覆盖equals和  hashCode. public class User{ private String name; private int age; priva ...

  10. C图形库 Mingw g++ ege Windows下

    今天闲来无事就想搞搞图形界面,本来是想弄openGL的但是配置有点麻烦,就觉得先弄个简单的图形库ege了. 1.下载头文件 地址:http://misaka.googlecode.com/files/ ...