中心與體選擇的頁面不工作，但與格頁面包裝

您好我有我開發一個HTML的網站做： HTML代碼是這樣的：中心與體選擇的頁面不工作，但與格頁面包裝

HTML：

<body> 
--Rest of code-- 
</body>

CSS ：

body{ 
    width:70%; 
    margin-left:auto; 
    margin-right:auto; 
    }

這不起作用。頁面不居中。然而，當我使用這個：

<body> 
    <div class="page-wrap"> 
    --Rest of code-- 
    </div> 
    </body>

和CSS：

.page-wrap{ 
width: 70%; 
margin-left:auto; 
margin-right:auto; 
}

這完美的作品。

我不明白爲什麼在css中選擇body不起作用。在body下的所有內容和div標籤下的內容是一樣的不是嗎？

還與CSS，在同一行我有這樣

<div class="A"> 
<div class"container"> 
<p>Hello</p> 
</div> 
</div>

在CSS代碼，如果我想風格的「你好」我必須使用

.A .container

只有

.A

即使本質上.A和.container包裝相同的內容也不起作用。

任何人都可以解釋這個概念嗎？

來源

2014-06-20 Chintan Shah

嘗試將html和正文中心對齊，所以'html {/ *您擁有body * /}的所有內容「在您的css – theonlygusti

中'DIV'是一個塊元素，'BODY'不是。嘗試'body {display：block; }' – algorhythm

'body {display：block}'不起作用 –

你可能想嘗試添加

html { width: 100%; }

這告訴身體，它是相對於70％..

另外，還要確保您的整個代碼是包裹着的<html>標籤。

JS Fiddle

來源

2014-06-20 15:57:14

沒有html的CSS規則，你的小提琴工作正常。 – j08691

也可以完整的HTML代碼無效，並沒有標籤... –

你的意思是jsFiddle的例子是無效的？ – j08691

其實......你都碼的工作！ http://jsfiddle.net/x6JGs/1/

body{ 
    width:70%; 
    margin-left:auto; 
    margin-right:auto; 
} 

.A { 
    color: red; 
    background: silver; 
}

來源

2014-06-20 16:02:28 LcSalazar

不知何故，這在jsfiddle中有效。無法在實際瀏覽器中使用（使用最新的Chrome瀏覽器） –

/* for block elements with position relative */ 
.position-relative { 
    margin-left: auto; 
    margin-right: auto; 
    width: {some-width}; 
} 

/* for block elements with position absolute */ 
.position-absolute { 
    left: 0; 
    right: 0; 
    margin-left: auto; 
    margin-right: auto; 
    width: {some-width}; 
} 
.parent-of-position-absolute { 
    position: relative; 
}

請知道，每一個塊的元件自動具有100％的寬度，沒有它，而具有寬度auto和的結果在父元素的全寬度。寬度100％破壞了那個，例如在IE中意味着100％的窗口。

來源

2014-06-20 16:05:41 algorhythm

中心與體選擇的頁面不工作，但與格頁面包裝

回答

相關問題