横幅图像应该有宽度100％

-1

我已经包含横幅图像。在我的一个代码中，它可以正常工作，但是当我在另一个代码中包含相同的横幅时，它无法正常工作。你能告诉我原因吗？在我的新代码中，我看到了横幅外的空白区域。横幅图像应该有宽度100％

http://jsfiddle.net/rajkumart08/y88WX/29/embedded/result/

.home .hero-unit { 
    background: none; 
    height: 318px; 
    padding: 1px 620px 0 0; 
    margin-right: -100px; 
    margin-left: -100px; 
    margin-bottom: 0; 
    background: url("http://www.defie.co/designerImages/defie_landing_page.png") right bottom no-repeat; 
} 

.hero-unit { 
    padding: 60px; 
    margin-bottom: 30px; 
    background-color: #eee; 
    -webkit-border-radius: 6px; 
    -moz-border-radius: 6px; 
    border-radius: 6px; 
}

来源

2013-03-04 user2044139

100％的英雄单位或100％的整个屏幕？ – penner 2013-03-04 19:49:57

.hero单元只有1250px和你的背景图像是容器内声明。尴尬的利润率是文字不会叠加在图像上的原因。在实际上是屏幕100％的div中定义背景。此外，请注意.container不是屏幕的100％。创建一个包含容器和您的.hero单元与背景图像的新div。

来源

2013-03-04 20:05:36 penner

删除被您所包裹你的“.hero单元”中的“.container”选择设置宽度。

或者你可以嵌套你的“.hero单元内“.container” '

<div class="hero-unit'> 
    <div class="container"> // Banner text etc </div> 
</div><!-- /hero-unit -->

来源

2013-03-04 20:10:19 defo550

横幅图像应该有宽度100％

回答

相关问题