背景图像没有在Chrome中垂直拉伸

时间：2010-12-27 05:46:06

标签： css

CSS - 

#header {       
    overflow: hidden;
    background: url(images/header-bg.png) top repeat-x #FFFFFF;        
    position: relative;        
    border: none;           
    display: block;
    height: 125px;   
    width:100%;
}

HTML - 

<div id="header">
    <a href="http://localhost/" title="Dev" id="logo"><img src="images/logo.png" alt="" /></a>
</div>

这在Firefox中很有用 -

alt text

但不是Chrome :( -

alt text

图像未在Chrome中垂直拉伸。

帮助！

请注意，我在Linux上。

编辑：背景图片（50x112px） -

alt text

请在此处查看 - http://movie-buffs.info/

2 个答案:

答案 0 :(得分：1)

因此，chrome会自动从另一个css文件中获取背景大小。

当我把

  

background-size：auto auto！important;

<{1>}中的

，

问题已经消失。

感谢大家的帮助。

答案 1 :(得分：0)

你用于背景的速记，是将颜色#FFFFFF放在最后一个参数中，它应该在第一个参数中。尝试摆脱速记，所以你的代码看起来像这样：

 /* background: url(images/header-bg.png) top repeat-x #FFFFFF;    */
 background-image: url(images/header-bg.png);
 background-repeat: repeat-x;
 background-color: #fff;
 background-position: top;

速记顺序：

background-color, background-image, background-repeat, background-attachment, background-position
相关问题
最新问题