navbar fixed navbar image too bog for mobiles, gets pushed below menu bar

[pazyluz+ 1]

I created an image for the fixed navbar on my desktop site. The image is too big for mobiles and gets pushed below the mobile menu bar. It not only looks ugly but takes up a lot of space.

What do I need to do to shrink this image so that it stays fixed in the nav area, fits beside the mobile menu and grows with the various size browsers for mobile devices?

This doesnt happen when I shrink my desktop browser or I would provide a screenshot.


peggygreen.net
DMS1
Details theme

[Danny+ 1,327]

Hi Peggy,

 

I am positive I have already informed you of this via our helpdesk. The issue is your image itself, the height is fine, but the width is too wide. So you can do one of two things.

 

1. Reduce your image sizes width via a photo editing software such as Photoshop or GIMP.

 

2. Use something called a Media Query to target your image for specific widths and reduce the image size via CSS. For more information on media queries, see the links below. Please be aware that media queries are used to change the DMS beyond what was on intended and therefore, we are unable to provide assistance if you encounter difficulties.

 

http://www.w3schools.com/cssref/css3_pr_mediaquery.asp

https://developer.mozilla.org/en-US/docs/Web/Guide/CSS/Media_queries

[pazyluz+ 1]

Thanks Danny. I dont think I've ever mentioned this specific issue but its likely I've raised other things like it. I was hoping to avoid media query and thinking there might be some other css gizmo.

[Danny+ 1,327]

If you do not wish to use media queries, then I would suggest you reduce the width of your image in a photo editing application.