html - Dropshadow not appearing on background-image div -


i'm having issue drop shadow not showing on header , i'm not sure if has background-image tag or being in div. it's header section @ top surrounded in homeheader div , shadow below isn't showing. here's css header;

#homeheader {     text-align: center;     font-family: 'lato';     color: white;     width: 100%;     height: 380px;     background-image: url(http://i.imgur.com/zjv1pxt.jpg);     -webkit-box-shadow: 0px 3px 5px rgba(100, 100, 100, 0.49);     -moz-box-shadow:    0px 3px 5px rgba(100, 100, 100, 0.49);     box-shadow:         0px 3px 5px rgba(100, 100, 100, 0.49); } 

the webkit-box-shadow, moz-box-shadow , box-shadow don't seem have effect on div , can't seem find out why.

i'm still new coding in general thank helps out!

edit: html;

<div id="homeheader">             </br>             <!--nav bar @ top right-->             <div id="navcontainer">                  <ul>                     <li><a href="home.html">home</a></li>                       <li><a href="portfolio.html">portfolio</a></li>                       <li><a href="about.html">about</a></li>                       <li><a href="#">resume</a></li> <!-- need direct -->                       <li><a href="#" class="mybutton">contact</a></li> <!-- need direct -->                 </ul>             </div>              </br></br></br></br>              <!--main header/title-->             <h1 class="name"> name</h1>             <h4 class="description">amateur html/css/js dev</h4>              <!--two buttons below-->             <a href="#" class="mybutton">contact</a>             <a href="#" class="mybutton">resume</a>              </br></br></br></br></br></br>              <!--down arrow button-->             <a data-scroll href="#content"><img src="http://i.imgur.com/dasbdv5.png" align="center" width="32"></a>                </div> 

the background-image property not formatted correctly. should be:

#homeheader { text-align: center; font-family: 'lato'; color: white; width: 100%; height: 380px; background-image: url('http://i.imgur.com/zjv1pxt.jpg'); -webkit-box-shadow: 0px 3px 5px rgba(100, 100, 100, 0.49); -moz-box-shadow:    0px 3px 5px rgba(100, 100, 100, 0.49); box-shadow:         0px 3px 5px rgba(100, 100, 100, 0.49); } 

see following w3schools rerence http://www.w3schools.com/cssref/pr_background-image.asp


Comments

Popular posts from this blog

c# - Validate object ID from GET to POST -

node.js - Custom Model Validator SailsJS -

php - Find a regex to take part of Email -