styling for class(background colour) is not working yet element styling(h2) is working

Lincks · July 8, 2023

This is my index.php page

<?php

//echo session_save_path();

error_reporting(E_ALL);

ini_set('display_errors', 1);

include ("database.php");

?>

<!DOCTYPE html>

<html>

<head>

<title>index</title>

</head>

<body>

<h2>hello world</h2>

</div>

</body>

<style>

.background-image{

background-image: url('/blueSunset.jpg');

background-size: contain;

width: 200px;

height: 200px;

}

</style>

</html>

This is my styles.css page

h2{

color: blue;

}

.background-image{

background-image: url(blueSunset.jpg);

width: 200px;

height: 200px;

}

My image is in the same directory as the two files. When I try styling using class it doesn't work in all cases not just this instance

cyberRobot · July 24, 2023

In case you are still looking for an answer, the issue might be caused by .background-image being defined twice. The definition in your styles.css is being ignored in this case, since you override all the rules in the <style> tag for the page.

For example, the following rule from styles.css

background-image: url(blueSunset.jpg);

Is overridden by the following rule in the <style> tag:

background-image: url('/blueSunset.jpg');

Note that the first rule says your image is in the same folder as the stylesheet...where the second rule says the image is in the root directory (note the slash). If the image isn't in the root directory, it won't show up.

Sign In

styling for class(background colour) is not working yet element styling(h2) is working

Recommended Posts

Lincks

Link to comment

Share on other sites

cyberRobot

Link to comment

Share on other sites

Join the conversation

Browse

Activity

Important Information