Any ideas why this CSS code doesn't work when I put it inside main.css file? I'm trying to make fullscreen background.
<html>
<head>
<link rel="stylesheet" type="text/css" href="CSS/main.css">
<style>
.bg {
background-image: url("nuotraukos/bg.png");
min-height:100%;
min-width: 100%;
background-attachment: fixed;
background-position: center;
background-repeat: no-repeat;
background-size: cover;
}
</style>
</head>
<body>
<div class="bg"></div>
</body>
</html>
Nothing seems to be wrong with your <link>
.
Check if the file really exists and if the html
page is in the same directory as the CSS
folder. Otherwise the file path is wrong.
If the image is not displaying, it's probably because it's not in the same path as the .css
, so you should change the link too.
Let's suppose your image is one folder up the css file. Then you should change the url to this:
url("../nuotraukos/bg.png");
Also it's not a good practice to use a div to set a background, so instead of using a div to set a background, set a background to the <body>
and stretch it.
body {
background-image: url("http://images.alphacoders.com/538/53823.jpg");
background-size:cover;
}
<head>
</head>
<body>
</body>
Maybe it would help if you change the path when you place main.css in the CSS folder?
background-image: url("../nuotraukos/bg.png");
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With