惯性聚合 高效追踪和阅读你感兴趣的博客、新闻、科技资讯
阅读原文 在惯性聚合中打开

推荐订阅源

Microsoft Azure Blog
Microsoft Azure Blog
J
Java Code Geeks
量子位
腾讯CDC
C
Check Point Blog
小众软件
小众软件
IT之家
IT之家
I
InfoQ
Hugging Face - Blog
Hugging Face - Blog
Stack Overflow Blog
Stack Overflow Blog
让小产品的独立变现更简单 - ezindie.com
让小产品的独立变现更简单 - ezindie.com
GbyAI
GbyAI
Apple Machine Learning Research
Apple Machine Learning Research
大猫的无限游戏
大猫的无限游戏
博客园_首页
S
SegmentFault 最新的问题
The Cloudflare Blog
阮一峰的网络日志
阮一峰的网络日志
aimingoo的专栏
aimingoo的专栏
P
Proofpoint News Feed
钛媒体:引领未来商业与生活新知
钛媒体:引领未来商业与生活新知
Google DeepMind News
Google DeepMind News
T
Tailwind CSS Blog
Martin Fowler
Martin Fowler

博客园 - 黑色泥土

FSO操作指南 将网站全部下载下来的ASP代码 ASP生成静态页面的方法 Javascript操作Excel总结 移除节点时候IE与FireFox的不同 Javascript的IE和Firefox兼容性汇编 添加数据要顺着来,删除数据要反着去。 无法打开本地安全策略的症状及解决 CSS中渐变背景的使用以及注意事项 指定CodePage类型,强制解决数据库查询乱码问题 IE中子栏目使用float属性后背景不能正常显示原因及解决 使用UL 列表结构建立横向导航栏需要注意的问题 页面刷新方法汇总 制作一个漂亮的提示框 网页CSS样式表设计十条技巧 IE与FireFox对CSS支持不足问题汇总之二 IE与Firefox的CSS兼容大全 浩方平台暗藏木马! IE与FireFox对CSS支持不足问题汇总之一
FireFox网页布局时候内容需自动换行时float属性不起作用
黑色泥土 · 2007-04-25 · via 博客园 - 黑色泥土

      使用Dreamweaver8编写如下代码: 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style type="text/css">
#left
{
    float
:left;
    background-color
:#3366FF;
}
#right
{
    float
:left;
    background-color
:#33CCCC;
}
</style>
</head>
<body>
    
<div id="left">
      这个是中间左边的内容
    
</div>
    
<div id="right">
      
<div>这里是一段较长的内容,注意firefox与IE中与左边内容位置关系的不同。这里是一段较长的内容,注意firefox与IE中与左边内容位置关系的不同。这里是一段较长的内容,注意firefox与IE中与左边内容位置关系的不同。</div>
    
</div>
</body>
</html>

    想要创建左右分栏的布局,但是由于右边的内容过多,会产生一个自动换行。在Dreamweaver预览与IE浏览器中查看的时候,布局是正确的。但是,在FireFox中,却变成了上下的布局。也就是此处的float:left属性无效了。

    此时可以采用Hack CSS方法,在CSS中添加代码,注意[xmlns]后面有空格。

/*针对FireFox进行Hack CSS 处理*/
[xmlns] #right
{
                     float
:none;
    position
:relative;
    margin-left
:130px;  // 此处的数值采用左边栏的宽度
}

    以上方法在FireFox2.0.0.3中通过。