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图像位置迫使窗口宽度太宽

回答

相关问题