Question

css 布局 ie 火狐 兼容问题

<div style="height:100px;background-color: #FF0000"> <p>abc</p> </div>
这一行代码 在ie 和火狐在 执行时效果不一样。

在IE下这行代码，的div能和上行一并在一起，但是如果是在火狐下就会分开
我偿试了一下发现代码主要是因为 <p>
假如代码改成
<div style="height:100px;background-color: #FF0000"> s<p>abc</p> </div>
就是在<p>的前面加上任意字母后就没有问题了。
但是在div中的内容由于程序需要，所以 有些时侯第一行开头一定会是<p>
我想知道如何才可以让ff下和IE一样 当<div>里面开头 是<p>时 这个DIV框仍能够和上一个div紧挨着。

Answer 1

　　您好！很高兴为您答疑！

　　取消高度设置，让其自适应，父元素上加<div style="overflow:hidden;zoom:100%;height:100px;background-color: #FF0000"><p>abc</p> </div>
　　您可以在火狐社区了解更多内容。希望我的回答对您有所帮助，如有疑问，欢迎继续在本平台咨询。

Answer 2

<div style="height:100px;background-color: #FF0000"><p style="margin:0">abc</p> </div>
你说的ie是ie7吧

或者在父元素上加<div style="overflow:hidden;zoom:100%;height:100px;background-color: #FF0000"><p>abc</p> </div>
基本上所有浏览器都兼容了

追问

div 里加上了 overflow:hidden;zoom:100%之后确实兼容了，但是出现了另一个问题，那就是如果里面的内容过多，超出的内容就直接隐藏了.. 还有别的解决方法吗..

追答

你不是已经设置它的高度是100px了吗，它当然就只有这么高了，你要让它高度自适应就去掉高度设置

Answer 3

p,div {
margin: 0;
padding: 0;
}
在css里加上这个试试

Answer 4

添加一行<div style="clear:both;"></div>

追问

这个试验了，不好使