關於內層標籤margin top無效的問題

2021-08-03 07:46:37 字數 1244 閱讀 9487

最近在頁面布局的時候遇到了這麼乙個問題:

charset="utf-8">

title>

type="text/css">

header

header

#logo_lg

style>

head>

class="logo">

href="#"

id="logo_lg">我是內層div>

div>

header>

body>

html>

如下圖,設定了margin-top,但是確沒有生效,很是困擾。

一般塊元素不受控制,我都預設是浮動的影響,但在這裡我沒有浮動。

為了解決這個問題,我將其改為定位。

charset="utf-8">

title>

type="text/css">

header

header

#logo_lg

style>

head>

class="logo">

href="#"

id="logo_lg">我是內層div>

div>

header>

body>

html>

問題就迎刃而解了

但是這個方式雖然達到了我的目的,但我依然無法理解為何margin-top不起作用。希望將來能找出這個問題的原因,回來將其寫上。

相應地辦法還可以給其父元素設定padding:

charset="utf-8">

title>

type="text/css">

header

header

#logo_lg

style>

head>

class="logo">

href="#"

id="logo_lg">我是內層div>

div>

header>

body>

html>

但是也要給父元素的寬高都相應地減少同樣的畫素,結果如下:

關於DIV多層巢狀的margin top的BUG

今天在做登入頁面的時候發現個margin top的bug 初始 如下 html css errorstyle結果發現ie6.ie7正常,ie8,ff顯示錯誤。癥結 當兩個容器巢狀時,如果外層容器和內層容器之間沒有別的元素,firefox會把內層元素的margin top作用于父元素。解決方案 1 使...

關於margin top失效的解決方法

float left clear both margin top 20px 會出現box2的上邊距 margin top沒有效果的情況 此時兩個層box1和box2,當為box1設定浮動屬性,box2清除浮動不具備浮動屬性。網上找到的兩種比較靠譜的解釋 1 在css2.1中,水平的margin不會被...

關於子元素的margin top影響父元素

來看看這個問題 子元素為什麼設定margin top會影響父元素的margin top。先把html,body,div的預設margin,padding設為0,再給父元素設定寬高,子元素設定寬高。然後又設定子元素的margin top為20px。效果如下 查了下,簡單來說是因為父元素沒有設定padd...