Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

can't change body background color using CSS reset

Here is my HTML code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
    <head>
        <title>Hover Zoom</title>
        <link rel="stylesheet" type="text/css" href="http://yui.yahooapis.com/3.3.0/build/cssreset/reset-min.css">
        <link rel="stylesheet" type="text/css" href="style.css">
        <meta http-equiv="content-type" content="text/html;charset=UTF-8" >
    </head>
    <body>

    </body>
</html>

Here is my CSS file code (style.css):

body {
    background-color: #FF0000;
}

but the background color of body does not change.

Without the CSS reset, it works fine. Can you suggest me a better CSS reset, or any other solution?

like image 304
Rahbee Alvee Avatar asked Dec 02 '22 02:12

Rahbee Alvee


2 Answers

change your selector to

html, body{
    background-color: #FF0000;
}
like image 149
brenjt Avatar answered Dec 09 '22 22:12

brenjt


brenjt's answer is correct, but I'll provide an explanation for what is wrong and why that solution works:

Your CSS reset file sets the background color of html which is the entire page. You are only setting the body's background color, but your body is extremely small in height since you have no content. Consequentially, you do not see the body's background color.

Just set both the html and body in CSS like this:

html, body { background-color: #FF0000; }

EDIT:

Had you not set the html background color, then body's background color would represent the whole page. But since you are using an external source's CSS reset, you do not have the option of not setting the html properties.

like image 24
Devin Burke Avatar answered Dec 09 '22 22:12

Devin Burke