Day 3: I'm almost done refining the new Rasa2 website after migrating from J1.5... And of course have a few more issues that I have been unable to resolve. These have to do with the top menu.
Old website for reference: 516arts.org
New website under construction: 516arts.org/516artsNEW/UPGRADE3

Problems:
1. I have managed to reformat the top menu so that it ALMOST looks like the old one, but in Firefox, the menu titles are crooked ("Programs" and "Opportunities" and "516 Store" sit just a few pixels higher than the others). They look okay in Safari and Chrome. I will attach a screen shot.

2. The dark background to the menu bar stretches out an extra couple of inches (on my computer screen) on the right so that it looks like there is a menu item missing. I would like to have the menu items fill the space and not have this "tail" on the right side.

3. When I view the site on my iPhone, the dark menu bar sits by itself at the top of the page (without a menu, of course); when I scroll down the page, it remains as a dark bar at the top of the page on top of the items on the screen.

I have some more issues, but will address them in a new message so as not to be too confusing!

Thanks,
Melody

Hi Melody,

I can't see the menu issue - being a PC user I'm seeing sans serif font

If you change font family do you get the same issue?

For the menu - are you planning to use the search position as that is most of the width currently?

The padding values can be tweaked a little but the search is most of it

Cheers
Paul

looking at your existing custom css together with the template css

try adding

@media screen and (max-width:787px) {
#menu {background:none; min-height: 0 !important;}
}

Cheers
Paul

Hi Paul,

Thanks for your answers.

1. Crooked menu items - I tried changing the Navigation font to Cambria and it changed for the menu items that sit lower (Home, About, Join, Support) but with the menu items that were a few pixels higher (Programs, Opportunities, 516 Store), the font remained Lucida. I will attach a screen shot. It is really only a few pixels, but enough to drive me crazy when I see it!

2. No, I don't want the Search to be in the top menu (it's in the footer). How can I remove it?

3. That worked - thanks!

Hi Melody,

ah its look the font family is the issue

If you change all the navigation to sans-serif do you see the alignment issue?

For 3. Click the eye in the search module in the layout section of the template settings

Cheers
Paul

Yes, it appears that the nav bar problem is a font issue, specific to the non-Google fonts. If I use all Google fonts for everything (body, etc.), the navbar looks okay. If I use Google Font for one and regular fonts for another, the navbar goes crooked (also if I use all non-Google fonts). So I'm using all Google fonts now.

I removed the search from the menu layout and changed the Menu Alignment to Center, and it looks much better now.

So the menu looks okay now! Just have to figure out my other issues now (on the other thread).

Thanks so much!
Melody

Are you planning to stick with google fonts on the menu?

Cheers
Paul

Google fonts for the entire website should be fine. I was just going with the traditional fonts because that's what was already set up on the old website.

Thanks,
Melody

Right cool

I'll check out the issue later today to see if its a stray sans-serif on he header link type

Cheers
Paul