Resizing Nav Icons on window resize

[sangars2]

Hello guys,

I have a nav bar made up of png icons. When resizing a page or displaying on other windows, the icons do not move so get cut off. I cannot find a way to resize the icons on different screens and make the icons white on hover? I know as they are .png’s I may have to create all of the icons in white aswell?

Anyway you can see it live at http://www.ssangar.com/ and here is my codepen for the nav: http://cdpn.io/msjzi (I notice the text transition doesn’t appear properly in codepen for some reason?)

Thanks in advance!

[Paulie_D]

To be honest, i wouldn’t use inline images here since what you are really doing is styling your menu.

Styling should be in the CSS and using background images would give you more control when using media queries.

However, a quick solve here is just to give the menu a fixed width…nothing wrong with that.

[Author]

Posts