CSS not updating my webpage

Hello everyone!

I’m pulling my hair out here! Help! Certain things are updating the webpage on my html and css files and certain things aren’t. I just can’t figure out why. Here’s a link to the code on GitHub: GitHub Link

This is the part of the code that isn’t updating the webpage:

  #home {
    padding-left: 50%;
  }

.main_heading {
  padding-top: 70px;
  text-align: right;
}

img {
  height: 50px;
  width: 50px;
}

ul {
  display: none;
}

I’d greatly appreciate your help!

Hi @vickyrai , there is only a README.md file with an initial commit so far in your repo, can’t see any of your code. Have you pushed your files to your repo yet ?

Hi! Thanks for looking! It’s under the other branch.

Ok I saw the files, so its mainly the CSS properties in your media queries which seem to be working fine, are you running this project locally on your computer ? Can you be more specific in regards to what is not working, and maybe including some screenshots, this might help to give some context to better help you.

Well, none of the code I pasted into my original post are being applied to the webpage. I just can’t see why!

Yes they won’t do anything unless you resize your viewport’s width down to 500px, and only then you will be able to see these changes, just try to resize your browser and you’ll see the changes.

Oh I see!! I’ve put the media query in the wrong place! It should be right at the end shouldn’t it?

Well once again it all depends on what you want to do, if you want all the CSS code that you’ve written so far to be applied to your index.html file, then just simply just remove the media query, unless you want some of this code to trigger on a smaller screen.

I do want it to be applied to me index.html file! Thanks so much for your help!

1 Like