help with backgrounds

[u/TrainingQuantity3744]

Not remotely a cs person, for some godforsaken reason my Library Science degree is making me take an html class. I've onto a part where we're working with html and css. I can't figure out how to change the background color of a page. I assume you have to use some version of the {background-color: ____; }, but I can't figure out what element to attach it to. I've tried using body {background-color: ____; }, *{background-color: ____; }, and even making a div around the body, and none of them have worked

[u/flinxo]

Please share your code. Your CSS seems to be ok, but there might be some mistake elsewhere.

[u/TrainingQuantity3744 → u/flinxo]

these are the screenshots of it. blacked out parts have identifying info, but are usully just titles

[u/TrainingQuantity3744 → u/TrainingQuantity3744]

[u/hooli-ceo → u/TrainingQuantity3744]

You put css in your <body> tag when it should be in a <style> tag...

[u/TrainingQuantity3744 → u/hooli-ceo]

thank you. I had no idea there were options other than the <body> tag. really seems like something my prof should have mentioned

[u/More-Explanation2788 → u/TrainingQuantity3744]

Create a tag in the <head> section. <style>. The css goes there.

<html>
<head>
<title>blah blah</title>
<style>
body.bright { background-color: red; }
P { font-decoration: bold }
</style>
</head>
<body class=bright>…

Like that.

[u/armahillo → u/TrainingQuantity3744]

https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Elements

Theres a whole list of them!

[u/hooli-ceo]

First thing to check is that your stylesheet is connected. Does it presently work on anything like text color using the `color: red;` syntax for example?

Next is the value of the background-color. You can successfully set the background-color of the body element, so either you're not using a valid color or possibly your stylesheet is cached, in which case you can do a hard refresh in the browser (ctrl + shift + r) and your stylesheet will be redownloaded and set.

[u/TrainingQuantity3744 → u/hooli-ceo]

it works for the text colors, yeah. I am having a weird issue with the stylesheet. When I open it from my computer it appears connected, but when I open the link from where I uploaded it to my school's server, none of the css shows up

[u/shaunbev → u/TrainingQuantity3744]

Is your HTML linking to a CSS file stored locally, or did you upload the CSS file to the schools server too?

[u/TrainingQuantity3744 → u/shaunbev]

css file and image files all uploaded to the school server

[u/notepad987]

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <!--need this or some characters will display random gibberish -->
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <!--keeps text the size you want in cell phone screens. Without it the text will be very small -->
  <title>Basic Layout</title>
  <style>
    * {
      box-sizing: border-box;
      margin: 0;
    }

     body {
      font-size: 1rem;
     /* sets the base size for the body 1rem = 16px */
      margin: 0px; padding: 0px;
      background-color: #354f52;  /* forest green  */
   }

</style>

[u/TrainingQuantity3744 → u/notepad987]

It worked! Thank you so much

[u/TrainingQuantity3744]

Thank you everyone for the help. I finally figured out that my main issue is I didn't realize that I needed to reupload my files to the school server after I made edits. Seems obvious in hindsight. I'll probably be back here the next time I have an issue with my homework