What is wrong with my JavaScript code?

Hi! I’ve been trying to add more padding to my title when it is less than 767px but it is not working. I’m just confused. Pls anybody’s help will be kindly appreciated. Thanks
Here is the pen

Your #title is a <span>, which means you can’t set vertical paddings on it (because it’s an inline element. Try putting it to display:inline-block, that should fix it.

Thanks. Another question, I tried to use jQuery to set only “Value Add” to Bounce when the browser’s with is less than 776px. That’s why I used the span. Any id or selector I can use?

If you are changing styles for #title, it won’t work because your <h1> title (Value add Boutique) ID is #main. #title1 is your sub-heading, ‘… the cradle of amazing designs!’

Why are you using viewport width (vw) for font sizes and vertical padding? em, rem and px or would be more appropriate for text, and vh (viewport height) for containers, but I suppose you could use it for margins and padding.

There are lots of external files, so it’s a bit confusing for me.