My background image is not working.
CSS:
.main {
color:rgb(5, 1, 0);
position:absolute;
border:3px solid lightgreen
background-image:url("images/some_image.png");
}
I've looked it over many times and I can't find what's wrong with this code. The URL is right, the syntax is right... What is wrong with this?
There is no semicolon after the border element definition.
Here is the correct definition:
border: 3px solid lightgreen;
background-image: url("images/some_image.png");
border:3px solid lightgreen
background-image:url("images/some_image.png");
You seem to have forgotten a semicolon on the line above.
Also, this is a relative, not absolute URL.
.main {
width: 100%;
height: 500px;
color: rgb(5, 1, 0);
position: absolute;
border: 3px solid lightgreen;
background-image: url("http://www.hdwallpapersimages.com/wp-content/uploads/2014/01/Winter-Tiger-Wild-Cat-Images.jpg");
-webkit-background-size: cover;
}<div class="main">
</div>As of right now, you're including your background-image inside your border! Put a semicolon after your border declaration, and your background image should work fine, if some_image.png is in the correct directory.
Your css should look like this:
.main {
color:rgb(5, 1, 0);
position:absolute;
border:3px solid lightgreen;
background-image:url("images/some_image.png");
}
