Why is it so hard to make my website screen size reactive?

I’m obviously new to coding and I’ve been trying to make my codepen screen size reactive but no matter how many youtube videos I watch and websites I read, making my site screen size reactive is proving to be a big challenge for me. What’s the easiest way to approach this? Thank you!

link - https://s.codepen.io/colinsteidtmann/debug/EogNyR/dGrXWXBopnBM

Also side note, if someone could help me add smooth scrolling to my codepens nav links that would be a huge help.

you can use the Bootstrap framework to make your website responsive.
You need to use its built in grid layout for this to take place.


If you don’t want to use an external library, you can check out a relatively new feature in CSS called grid. Its pretty nifty.

1 Like

You could also use media queries to handle column layout manually W3 Schools Media Queries