兩個div空白字元的問題

2021-08-09 03:47:17 字數 707 閱讀 2267

例如在乙個寬度1024px的盒子裡,放乙個80%左盒子和20%右盒子。**如下:

(與bootstrap無關)

class="container">

class="left">div>

class="right">div>

div>

css如下:

html, body

.container

.container>div

.left

.right

style>

首先想在一行放兩個盒子,需要display 行內塊級元素才行。但是這樣其實兩個盒子並不能在一行如圖

其中粉色左盒子,黃色右盒子,背景灰色為container背景。

class="left">div>class="right">div>

但是治標不治本,因為編輯器自帶格式化功能,導致會誤格式化

2、常用解決辦法

在父親容器裡加入 font-size: 0;清除空白字元,如果需要在子盒子寫字的話,子盒子加入具體 font-size: 具體px;即可

.container

最終效果

html中的空白字元問題

1 當我們想使用百分比來進行兩個盒子的併排 doctype html html lang en head meta charset utf 8 style html,body container container div left right style head body div class c...

讓兩個Div併排顯示

一 使用display的inline屬性 aaaa bbbb 二 通過設定float來讓div併排顯示 1111 2222 2222 2222 三 對於兩個div併排,左邊為絕對寬度,右邊為相對寬度的,需要用到這種布局的情況比較多見,如左邊為導航,右邊為內容的頁面 1 將最大的容器padding l...

css 讓兩個div重疊

做網頁的時候在div裡放了乙個別的網頁的天氣外掛程式,但是點選了會跳到廣告頁面的,想去網上找個禁止div點選的方法,可是發現沒有,用了js的方法好像也沒有成功,後來覺得還是用兩個層重疊的方法來阻止點選,雖然定位是有點麻煩 relative是相對定位的意思。absolute是絕對定位,很奇妙少了乙個都...