Header Nav Menu / Logo

ABPhotography

Hi,

I have a problem with the appearance of the header on my website. I'm loving Smugmug so far but still during my trial period and if I can sort this out I'm sold. Everything, well almost everything, else is great.

My page is: http://alexbradburyphotography.smugmug.com

On a big screen the header looks great - the nav menu / logo are positioned correctly etc. On a mobile it works great to - the menu 'collapsed for mobile' option is selected and does the job fine. What I want to do is make the collapsed menu appear just before the screen is shrank to a size that the menu links start appearing over the top of my logo. In other words I looking for CSS to make the collapsed menu appear on bigger screen sizes so that it won't look so terrible on an iPad.

I'm sure there must be a way of doing this but unfortunately I'm not that clued up on CSS with Smugmug.

Any ideas or advice much appreciated.

bobbyhero

I'm not aware of a way to do this, but someone else may chime in that has some insight.

leftquark

We can use some CSS to tweak your navbar for Tablets. One option is to have a second navbar that's different from the first, that only is displayed for tablets. The original navbar would get hidden for tablets. We can also customize the current navbar to work within tablets. Unfortunately, the collapsed navbar is only possible for mobile devices.

It looks like the menu works well when a tablet is in landscape orientation. I see the navbar is completely disappeared in portrait orientation though

By the way, your site looks beautiful and you have some wonderful images! Well done on it!