i facing simple problem taking lot of time.
i have simple css defines image background:
#header-content{ background-image: url("../images/header-img.png"); background-repeat: no-repeat; background-position-x: center; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; }
and div in html page has id:
<!-- header --> <div id="header"> <div class="container-fluid"> <div class="row"> <div class="col-md-12"> <div id="header-content"> </div> </div> </div> </div> </div> <!-- header -->
very simple. image not shown. problem?
p.s.: image directory correct.
your problem #header-content div doesn't have size. try adding: height: 100px; width: 200px
#header-content{ background-image: url("http://unsplash.com/photos/1-isiwubmiw/download"); background-repeat: no-repeat; background-position-x: center; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; height: 100px; width: 200px; }
<!-- header --> <div id="header"> <div class="container-fluid"> <div class="row"> <div class="col-md-12"> <div id="header-content"> </div> </div> </div> </div> </div> <!-- header -->
Comments
Post a Comment