無法使用CSS來嵌套div的

我正在使用CSS格式化頁面的標題。我無法正確顯示<div>（班級爲header_button）。我試圖在頂部有一個靜態標題，裏面有一個按鈕，右邊有一個靜態標題。相反，它出現在右側，（在正確的區域），除了標題區域之外。首先，這裏是頭的樣式：無法使用CSS來嵌套div的

div.header { 
// Used to keep header in the same position on the page 
position: fixed; 
height: 50px; 
background: -webkit-linear-gradient(#191919, #474747); /* For Safari 5.1 to 6.0 */ 
background: -o-linear-gradient(#191919, #474747); /* For Opera 11.1 to 12.0 */ 
background: -moz-linear-gradient(#191919, #474747); /* For Firefox 3.6 to 15 */ 
background: linear-gradient(#191919, #474747); 
background-color: black; 
margin: 0px auto; 
width: 100%; 
// Used to keep the header at the top 
top: 0px; 
}

而這些是應該進入頭部的div的樣式。

div.header_button { 
color: #ccffcc; 
border-radius: 10%; 
background-color: #3333ff; 
font-size: 24px; 
font-weight: 200; 
text-align: center; 
padding: 2px; 
width: 4%; 
text-align: center; 
// Used to keep the button almost on the right edge 
margin-left: 94%; 
}

這是我使用嵌套的header_button DIV的header本身內部的HTML。

<div class="header" > 
    <p> 
     Testing Text 
    </p> 
    <div class="header_button"> 
     Test 
    </div> 

</div>

我在做什麼錯？

我感謝您的反饋。

來源

2014-05-11 ethan17458

[**小提琴**]（http://jsfiddle.net/2Nx3f/） – Oriol

注'// '不會開始CSS評論。你必須使用'/ * * /'。看到[spec]（http://www.w3.org/TR/CSS2/syndata.html#comments） – Oriol

@Oriol這很有趣。 Netbeans IDE似乎強調它是一個評論。謝謝。 – ethan17458

Demo

HTML：

<div class="header" > 
    <div class="header_button"> 
     Test 
    </div> 
    <p> 
     Testing Text 
    </p> 
</div>

CSS：

div.header_button { 
    float: right; 
}

來源

2014-05-11 00:41:18 Oriol

完美地工作。我以前曾嘗試過這種方法，但它不起作用。哦，非常感謝。我選擇了答案。 – ethan17458

無法使用CSS來嵌套div的

回答

相關問題