Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

CSS code in HTML and main.css

Tags:

html

css

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>
like image 540
Tadas Avatar asked Dec 27 '15 20:12

Tadas


2 Answers

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>
like image 192
Phiter Avatar answered Oct 11 '22 22:10

Phiter


Maybe it would help if you change the path when you place main.css in the CSS folder?

background-image: url("../nuotraukos/bg.png");
like image 38
The fourth bird Avatar answered Oct 11 '22 22:10

The fourth bird