Why doesn't background Color work?

<!DOCTYPE html> <html lang=cs> <head> <title></title> <meta charset="utf-8"> <meta name="viewport" content="width=device-width"> <link rel="stylesheet" href="style/HStrana.css" > <link href='https://fonts.googleapis.com/css?family=Sarina' rel='stylesheet'> </head> <body> <header> <h1 class="logo">Loren Ipsum</h1> <nav> <ul class="NavBar"> <li><a href="index.html">Home</a></li> <li><a href="About.html">About</a></li> <li><a href="services.html">Services</a></li> </ul> </nav> </header> </body> </html> body{ margin: 0; padding: 0; } header{ background-color: #333; } .logo{ float: left; color: tomato; margin-left: 40px; font-style: italic; font-family: Sarina; } .NavBar li a{ margin-top: 36px; margin-right: 40px; text-align: center; float: right; text-decoration: none; font-family: arial; color: red; } li{ list-style-type: none; }

html css error web color back

23rd Dec 2019, 12:18 PM

Martin Adamec

2 Answers

+ 1

Header tag doesn't have a width and/or a height. So the program wouldn't know how much to fill with color. Just add a width and height you want: [example] header{ background-color: #333; width: 200px; height: 200px; } But if you want to have the color as the background of the page, I would recommend putting the background-color inside body{ }: body{ margin: 0 padding: 0 background-color: #333 }

23rd Dec 2019, 12:51 PM

molang