Bouncy menu

Poster: alun
Dated: Saturday February 2 2008 - 15:25:01 GMT

Hi

I'm using the Milonic menu but it bounces for me.

Can anyone see what I'm doing wrong. My site is http://www.parrysongs.co.uk

many thanks

al

Re: Bouncy menu

Poster: Ruth
Dated: Saturday February 2 2008 - 20:22:01 GMT

Hi,

OK, this is a css code that for some reason the menu is picking up, it is the a: hover section for the ul/li stuff. Most can be fix by adding code to the menu data file, but one thing has to be fixed in the css itself.

1. make this change and add the other items to your style in the menu data file. The a and b items below force the browsers to use the padding in the menu rather than picking up the padding in the css that is being set for the ul/li nav stuff. The onborder=0 etc, is forcing the menu to ignore the border coding in the a hover stuff and preventing that border in the css from showing up when you hover over an item in the menu.

a. change padding to 0. padding=0;
b. add rawcss="padding:8px 7px 8px 7px";
c. add onborder="0px solid transparent";

2. the css change that has to be done is to go to the #header-nav-bottom a:hover, #header-nav-bottom a.selected { section It is actually the a:hover part that is causing the issue and it is coming from the padding using ems. I'm assuming that the em, which is relative to 'parent' is being picked up by the menu, I tried to do something in the menu, but there is no property for the hover font size. I mean you have fontsize and it's just fontsize, not an off fontsize and on fontsize. I tried even using onbold=0; to force the menu to not bold hoping that would fix it, but it does not. Then, I tried changing the 1.0em padding to something smaller, but it is the actual use of the em that is the problem in this particular hover area. The em doesn't seem to be a problem any where else. I don't know why this em thing is an issue with the hover. The problem only occurs in IE. The other menu changes fix everything in FF, but to fix IE you also have to change that em padding in the a hover section of the css to px.

Hope this helps.

Ruth

Re: Bouncy menu

Poster: Ruth
Dated: Saturday February 2 2008 - 20:33:59 GMT

I forgot, I had a question. How come you have that code for safari? I removed it, just because I'm always curious to see things, and the page looks fine in Safari 3 for pc. It looks just like in IE and FF

Ruth

Re: Bouncy menu

Poster: alun
Dated: Saturday February 2 2008 - 22:37:40 GMT

Mac Safari users told me it didn't work correctly otherwise. I have the pc version and it looks fine for me too. But they tell me that it doesn't on a Mac.

Thanks for the advice above. I'll read through thoroughly and let you know how I got on with it.

Al

Re: Bouncy menu

Poster: alun
Dated: Saturday February 2 2008 - 22:46:03 GMT

thanks Ruth

that seems to have done the trick. you're a star!!

al

Re: Bouncy menu

Poster: Ruth
Dated: Saturday February 2 2008 - 22:54:15 GMT

As to the Safari issue, if someone could give you a screenshot so we know what is happening, that is probably a fixable issue, also. Or, you might be able to set up a detect code for the safari that shows it as if safari && Mac or something like that so it detects the OS as well as browser. I only suggest it because as a visitor, were I to see the 'use another browser', depending on my mood, I might get a bit ticked Anyway, a screenshot would at least give you a starting point to see what's going on in Safari.

Ruth

Re: Bouncy menu

Poster: alun
Dated: Saturday February 2 2008 - 22:56:39 GMT

i believe there is a website somewhere that shows you what sites look like in Safari. i'll try to rediscover what that site is and get a screenshot of it.

thanks

al

Re: Bouncy menu

Poster: alun
Dated: Sunday February 3 2008 - 0:00:52 GMT

the sit i was thinking of was http://www.browsrcamp.com

the lack of an e in browsr is not a typo

that shows the page with the right hand side overwritten over the main section of the page

al

Re: Bouncy menu

Poster: Ruth
Dated: Monday February 4 2008 - 3:16:20 GMT

Hi,

You can also try here http://browsershots.org/ Just make sure you notice [as I didn't ] all the browsers that are check and uncheck them so only those you absolutely need are checked. It took me forever to get the two screen shots I wanted.

Anyway, your page works fine in Safari 3 on mac or pc. It is only the older ones that have the problem. I don't know what it is, haven't been able to figure it out, however, I did find a layout which looks like yours as to columns, header, footer which looks correct in the older Safari. I don't do any in depth css so I'm not really able to look at either and see things. Given I only have my personal site and haven't updated in years, it's still tables, which is just fine for me

http://www.satzansatz.de/cssd/companion ... rcfsa.html

Ruth