html圖像位置迫使窗口寬度太寬

我正在嘗試使網站的頁眉沿着整個頁面寬度重複，網站的名稱位於標題中心，並且網站名稱稍微偏移了一個徽標。如果屏幕寬度太小而不能顯示整個標識，我只是希望它將標識切斷到右側，否則將顯示整個標識（即顯示器/窗口足夠大，而我不我希望它或多或少地位於標題附近。html圖像位置迫使窗口寬度太寬

但是，我找不到一種方法來做到這一點，我不能使用溢出-x或溢出-Y（因爲瀏覽器支持）和標記了，我現在剛剛擴大了窗口的滾動條，以適應整個圖像（見截圖）。

下面是屏幕截圖

http://img691.imageshack.us/img691/3188/screenshot03062011.jpg

這裏是標記和CSS：

<div id="header-wrap"> 
    <div id="header"> 
     <img src="title-card.png" /> 
     <img id="this-chick-logo" src="this-chick-logo.png" /> 
    </div> 
    </div> 

-- 

    body 
    { 
    background: #dfb1e4; 
    padding: 0px; 
    margin: 0px; 
    } 

    #header-wrap 
    { 
    background: url('header-bg.png') repeat-x; 
    width: 100%; 
    height: 291px; 
    } 

    #header 
    { 
    margin: 0 auto; 
    width: 1000px; 
    text-align: center; 
    } 

    #header img 
    { 
    margin-top: 105px; 
    } 


    #header img#this-chick-logo 
    { 
    margin-top: -75px; 
    margin-left: 680px; 
    overflow: hidden; 
    }

感謝。

來源

2011-06-03 hella_bent

''我不能使用overflow-x或overflow-y（因爲瀏覽器支持）「' - 你可以擴展嗎？所有瀏覽器都支持 – thirtydot 2011-06-03 20:29:11

溢出。 IE6有一些溢出問題：可見，但就是這樣。 http://www.quirksmode.org/css/contents.html – mrtsherman 2011-06-03 21:09:59

添加

overflow: hidden;到#header-wrap

不要把它放在圖像上。

來源

2011-06-03 20:48:25 Halcyon

overflow: hidden;或者需要添加到#header-wrap並可能從img#this-check-logo中刪除。此外，如果女孩喜歡向右推並且其中的一部分在溢出時被切斷，並且您不希望我一次向後移動她的幾個像素點，直到您得到它的方式喜歡它。如果你不介意一點點切斷，只需加上overflow: hidden即可。

來源

2011-06-03 21:24:02 Jem

html圖像位置迫使窗口寬度太寬

回答

相關問題