Having trouble implementing background colors and images for certain div/sections

HTML-CSS
#1

I am having trouble putting color or certain background images for specific images/sections and do not what I am doing wrong.
Below is my the portfolio code:


Thanks!

#2

remove the two tags from the css pane: <style> and </style> are breaking your code.

1 Like
#3

While I’m looking at that, though, there is something you’re doing that you may want to think twice about:

<section id="welcome-section">
  <div class="background">
    <h1> Personal Portfolio Webpage </h1>
  </div>
</section>

So the section tag is a block-level element, rendered exactly as a div. The div tag is also a block-level element. As is, interestingly, the h1 tag. So you’ve put a box in a box in a box. Not necessary, and adding complexity for no reason.

As a general rule, if any tag exists solely to contain only one other tag, one of them may be unnecessary. In the above case, the entire thing could be rewritten:

<h1 class='background'>Personal Portfolio Webpage</h1>

… and it would render exactly the same.

#4

I ended up making a separate block element because I was trying to see if the background color implementation would work because I was trying to add the class of the background color in header only before and it did not work. I ended up deleting the unnecessary block-level element, but I cannot quite understand the cause of the color not showing up in the background.

#5