html – 使用`display:table-cell`on divs有缺点吗?

html – 使用`display:table-cell`on divs有缺点吗?,第1张

概述我想要完成的是具有固定宽度的第一个div和一个流体的第二个div,它将填充父div宽度的其余宽度。 <div class='clearfix'> <div style='float:left; width:100px;'>some content</div> <div style='float:left'>some more content</div></div> 在这一切上,一切似乎都 我想要完成的是具有固定宽度的第一个div和一个流体的第二个div,它将填充父div宽度的其余宽度。
<div class='clearfix'>  <div style='float:left; wIDth:100px;'>some content</div>  <div style='float:left'>some more content</div></div>

在这一切上,一切似乎都很流畅。

<div style='display:table'>  <div style='display:table-cell; wIDth:100px;'>some content</div>  <div style='display:table-cell'>some more content</div></div>

我想继续第二个,但我觉得第二个例子会给我以后的头痛。

你能提供一些建议或见解吗?

解决方法 显示:table-cell是完美的使用,只有一个缺点..

它不工作在ie7(或ie6,但谁在乎?):http://caniuse.com/#search=css-table

如果您不需要支持ie7,请随时使用。

ie7仍然有@L_419_1@,但您应该检查您的Google Analytics(分析),然后作出决定。

为了回答您的具体用例,您可以在不显示的情况下执行:table-cell,前提是您不需要根据内容调整高度:

http://jsfiddle.net/g6yB4/

<div class='clearfix'>  <div style='float:left; wIDth:100px; background:red'>some content</div>  <div style='overflow:hidden; background:#ccc'>some more content</div></div>

(为什么overflow:hIDden?With:http://jsfiddle.net/g6yB4/3/ vs without:http://jsfiddle.net/g6yB4/4/)

总结

以上是内存溢出为你收集整理的html – 使用`display:table-cell`on divs有缺点吗?全部内容,希望文章能够帮你解决html – 使用`display:table-cell`on divs有缺点吗?所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错,欢迎将内存溢出网站推荐给程序员好友。

欢迎分享,转载请注明来源:内存溢出

原文地址:https://54852.com/web/1112613.html

(0)
打赏 微信扫一扫微信扫一扫 支付宝扫一扫支付宝扫一扫
上一篇 2022-05-29
下一篇2022-05-29

发表评论

登录后才能评论

评论列表(0条)

    保存