文章詳情頁

css3 - 自己做的CSS網格系統里面為什么兩個div不能同行？

瀏覽：236日期：2023-07-30 11:53:18

問題描述

兩個width都是50%的p，設置了向左浮動，為什么它會出現換行？如果設置49%就不會了，這是為什么？

問題解答

回答1：

box-sizing:border-box

回答2：

兩個p的邊框、內邊距、外邊距等等都給弄成0試試

回答3：

p寬度的計算方式的問題box-sizing可以指定以內容，外邊距，邊框為界線計算width數值以百分比計算寬度，就有可能導致實際寬度加總超過父容器的總寬，對于左浮動的p來說就是換行，像是左浮動沒有效果

回答4：

是IE7么？非上則設置了padding,border-width么？非上則有box-sizing:border-box設置了margin值么？ show us the code.

回答5：

注意盒模型考慮 border padding margin

回答6：

一般還是把代碼貼出來比較好分析。如果樓上答案都不行，可以看看這個 http://www.html-js.com/article/Do-not-obey-the-inlineblock-browser-on-...

回答7：

看看盒模型吧?！禖SS設計指南》里說得很清楚了。

回答8：

如果樓主使用inline-block的話,那么其實瀏覽器把樓主的兩個p當成行內元素處理,而行內元素默認兩邊自帶空格,樓主試試在其父元素上設置一下font-size:0px;使得兩邊空格大小不占地方.然后跟一條-webkit-text-size-adjust:none解決chrome系最小文字為12px的問題

CSS

上一條：前端 - css3漸變在移動端的支持如何？下一條：CSS3 border凹陷該如何編寫？

相關文章：

1. docker api 開發的端口怎么獲取？2. docker - 如何修改運行中容器的配置3. docker start -a dockername 老是卡住，什么情況？4. macos - mac下docker如何設置代理5. docker鏡像push報錯6. dockerfile - 我用docker build的時候出現下邊問題麻煩幫我看一下7. docker網絡端口映射，沒有方便點的操作方法么？9. angular.js使用$resource服務把數據存入mongodb的問題。10. docker 下面創建的IMAGE 他們的 ID 一樣？這個是怎么回事？？？？