Reputation: 85
Firefox isn't interpreting my background header image the way IE, Chrome, or Safari do. Why is that?
Page: http://wlvrtn.com/sites/nms/page.php How it should look: http://cl.ly/OCbp
HTML:
<header class="banner banner-1">
<h1>About Us</h1>
</header>
CSS:
.banner {
position: relative;
text-align: center;
overflow: hidden;
height: 229px;
padding-top:105px;
z-index: 0;
width: 100%;
margin: 0 auto;
background-color: #8ab2a9;
background-repeat: no-repeat;
background-position-x: center;
background-position-y: bottom;
}
.banner-1 {
background-image: url(../images/banners/banner-01.jpg);
}
Upvotes: 0
Views: 75
Reputation: 28437
Add
.banner-1 { background-position: center bottom;}
And it should work.
Upvotes: 3