Reputation: 1313
I am making an app using ionic, however the background image does not appear no matter what I try. I checked previous questions but non of the solution worked for me. This is my css:
body {
background-image: url("img/national day.png");
display:block;
position:absolute;
min-height: 100%;
background-repeat: no-repeat;
background-size: 100% 100%;
background-position: center;
width: 100%;
height: 100%;
margin: auto;
/*position: relative;*/
}
I know that the path is correct for sure because its there in the frames when I debug using chrome. There is an img file in my css directory.Why isn't the picture appearing though fiddle:https://jsfiddle.net/y04jpe0h/
Upvotes: 0
Views: 120
Reputation: 1313
I couldn't know why it is not working in the end so I just added the background image to the pane and it got displayed. Remains a mystery..
Upvotes: 0
Reputation: 72
At first to access folder img you have to put :
background-image: url("../img/logo.png");
because img folder is not into css folder.
Second make sure you have the image in img folder because i didn't find it into fiddle so it try logo .png and it works.
Upvotes: 1
Reputation: 790
Try this. I Removed the background size 100% 100% property.
{
background: url("img/national day.png") no-repeat center center fixed;
display: block;
position: absolute;
min-height: 100%;
background-repeat: no-repeat;
width: 100%;
height: 100%;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
margin: auto;
}
Hope this helps you.
Upvotes: 1
Reputation: 3461
Add this part of CSS in your code
html{
height:100%;
}
Hope that works!
Upvotes: 1