html - My background image keeps getting cut off at the bottom? -


this isn't duplicate, i've looked @ similar questions , tried solutions nothing has worked. half image keeps getting cut off, other solutions have centered didn't strech across page wanted without being distorted, ideas on what's wrong?

html

<! doctype html public "-//w3c//dtd html 4.01 transitional//en" "http://www.w3.org/tr/html4/loose.dtd"> <html> <head> <meta http-equiv="content-type" content="text/html;charset=iso-8859-1" /> <link rel="stylesheet" type="text/css" href="mainpage.css"/> </head> <body>  <div id="header">    </div>   <div id="body">   </div>   <div id="footer">   </div>   </body>  </html> 

css

body{width: 100%;     margin:0px;     padding:0px;       }     #header{     height:2300px;     background-color:pink;     background-image: url("http://horoscopespot.net/wp-  content/gallery/pisces/pisces-shadow.jpg");     background-repeat: no-repeat;     background-size:cover;      } 

add margin-bottom:10px; or padding-bottom:10px;

also, background-size: 100% 100% can help.


Comments

Popular posts from this blog

toolbar - How to add link to user registration inside toobar in admin joomla 3 custom component -

linux - disk space limitation when creating war file -