如何防止固定位置標題擴展超出瀏覽器寬度

我的頁面頂部有一個固定標題，它應該是寬度：100％，但它超出了窗口的寬度。誰能告訴我我在這裏失蹤了什麼？我已經嘗試將父div重置爲0邊距。我已經嘗試在父div中包裝標題。我試圖按照建議的here添加箱子大小，這也沒有幫助。在任何情況下，標題都會繼續擴展到瀏覽器窗口的右側。如何防止固定位置標題擴展超出瀏覽器寬度

HTML：

<body> 
    <div class='header'> 
    <h1 class='name'>some name</h1> 
    <button class='link-button' type='menu'>Links</button> 
    <div class='navigation-links'> 
     <a href="#link" class='header-link'>some link</a> 
    </div> 
    </div> 
    <div> 
    <h3>content</h3> 
    ... 
    </div> 
</body>

CSS：

html { 
    margin: 0; 
    padding: 0; 
    font-family: 'Roboto Slab', serif; 
} 

body { 
    margin: 0; 
    padding: 0; 
} 

.header { 
    position: fixed; 
    top: 0; 
    left: 0; 
    width: 100%; 
    z-index: 1; 
    background-color: rgba(27,62,111,1); 
    text-align: center; 
    height: auto; 
    margin-bottom: 0; 
}

感謝您的幫助！

來源

2014-10-07 beaglebets

在Chrome中我看起來很好。也許添加一個截圖？ – ipavl 2014-10-07 02:11:08

無法使用您發佈的代碼進行復制。 – 2014-10-07 02:11:09

對我來說也適用於鉻。 – EternalHour 2014-10-07 02:16:22