Hi All,
So I am working on my personal webpage and currently have this navigation bar that sticks to the top of the window a you scroll. The problem is that if you resize the window the font inside the navigation bar is not scaling down. I’ve used percentages for the font sizes, but still no luck. Below is the link to my code pen.
*Note this is only the 2nd time I’ve ever coded anything.
Thanks
On line 24, you have the class liquid-container. I think you meant container-fluid, which is a Bootstrap class. Changing this made your navbar resize for me.
You’re doing well! Keep it up!
The problem seems to still be persisting. It is not the size of the nav bar that isn’t changing its the font/links inside the nav bar that are maintaining the same font size making the text wrap below each other for the links when the window width is changed.
Try to play with this
set to a tag in li element
font-size: 3.6vw;
also move
list-style-type: none;
from li element to ul
U can’t scale it just with typing %
In that case u can only scale them with zooming
On other hand u can create media queries at particular width to shrink or vice versa
http://kyleschaeffer.com/development/css-font-size-em-vs-px-vs-pt-vs/