CSS Menu Highlighting Problem

[Ste]

Hi there,

I'm using CSS to highlight main navigation items in a 'suckerfish menu'
for the currently loaded page, i.e. when on the home page, the 'home'
navigation item should be highlighted.

I've almost got this working, except for some reason, the highlighted
background block isn't quite covering the full area of the menu item.

For example, see this beta page (via TinyURL): http://tinyurl.com/2bk78a

You can see that the Home navigation item is highlighted in red. This
looks fine upon first glance, but if you hover over it, you'll see a
white hover colour 'behind' the red background which shows the full
width that the menu item should be highlighted in red up to - so there
shouldn't be any gaps between menu items.

Can anyone tell me why this is happening and how I can fix it please?

Thanks for any advice,

Ste

[rf]

Re: CSS Menu Highlighting Problem


"Ste" <23232@23232.co mwrote in message
news:46d0d4da$0 $21094$da0feed9 @news.zen.co.uk ...

Hi there,
>
I'm using CSS to highlight main navigation items in a 'suckerfish menu'
for the currently loaded page, i.e. when on the home page, the 'home'
navigation item should be highlighted.
>
I've almost got this working, except for some reason, the highlighted
background block isn't quite covering the full area of the menu item.
>
For example, see this beta page (via TinyURL): http://tinyurl.com/2bk78a
>
You can see that the Home navigation item is highlighted in red. This
looks fine upon first glance, but if you hover over it, you'll see a white
hover colour 'behind' the red background which shows the full width that
the menu item should be highlighted in red up to - so there shouldn't be
any gaps between menu items.

Be aware that IE6 does not support :hover on anything other than <a href=>
elements. Your hover does not work in IE6 and causes the the text to be dark
grey on blank, that is unreadable.

The standard way is to make the <aelements block (#nav2 a: {display:
block}) and apply your :hover etc to the <a>.

--
Richard.

[dorayme]

Re: CSS Menu Highlighting Problem

In article <46d0d4da$0$210 94$da0feed9@new s.zen.co.uk>,
Ste <23232@23232.co mwrote:

Hi there,
>
I'm using CSS to highlight main navigation items in a 'suckerfish menu'
for the currently loaded page, i.e. when on the home page, the 'home'
navigation item should be highlighted.
>
I've almost got this working, except for some reason, the highlighted
background block isn't quite covering the full area of the menu item.
>
For example, see this beta page (via TinyURL): http://tinyurl.com/2bk78a
>
You can see that the Home navigation item is highlighted in red. This
looks fine upon first glance, but if you hover over it, you'll see a
white hover colour 'behind' the red background which shows the full
width that the menu item should be highlighted in red up to - so there
shouldn't be any gaps between menu items.
>
Can anyone tell me why this is happening and how I can fix it please?
>

You could try putting your "current" style on the list item
instead?

li#homenav { color:#444444; background: red; }

and moving the id to inside the relevant list item. In the case
of the home page it would be:

<li id="homenav" style="font-size: 37.4px; line-height:
37.4px;"><a style="font-size: 37.4px; line-height: 37.4px;"
href="http://www.beta.zestim ages.com/">HOME</a>

Which very much reminds me to say this design is all hopeless
acrobatics. It is a nice example of an attempt to do things fine
grained in pixels. A nightmare! For a start, see what breaks at a
few clicks of browser text enlargement.

_______________ ___
[Anyone the slightest bit interested to know if I succeeded in
replacing the power booster in my Ford XY yesterday _without_
disconnecting the master cylinder? Can anyone smell any brake
fluid over my words here?]

--
dorayme

[Beauregard T. Shagnasty]

Re: CSS Menu Highlighting Problem

Ste wrote:

Thanks for any advice,

How about:

body { margin: 0; padding: 0; font-size: 71%; font-family: verdana,
arial, helvetica, sans-serif;

71% ... and Verdana ... I have to increase text size to read your
content, which is less than 3/4 of my preferred size.

See this page:

http://k75s.home.att.net/fontsize.html

Also, your page doesn't fit in my browser window without horizontal
scrolling.

--
-bts
-Motorcycles defy gravity; cars just suck

[rf]

Re: CSS Menu Highlighting Problem


"Gus Richter" <gusrichter@net scape.netwrote in message
news:E-Cdnb3uGbnde03bn Z2dnUVZ_qOknZ2d @golden.net...

Ste wrote:

>>
>For example, see this beta page (via TinyURL): http://tinyurl.com/2bk78a

>
Why would you use a tinyURL?

As the site is in beta the OP might have wanted to keep the real URL
unmentioned, so it wont end up in places like google groups and thus be
prematurely found by the search engines. Begs the question: Does google
follow tinyurl redirections?

--
Richard.

[Ste]

Re: CSS Menu Highlighting Problem

On 2007-08-26 02:39:41 +0100, "rf" <rf@invalid.com said:

>
"Ste" <23232@23232.co mwrote in message
news:46d0d4da$0 $21094$da0feed9 @news.zen.co.uk ...

>Hi there,
>>
>I'm using CSS to highlight main navigation items in a 'suckerfish menu'
>for the currently loaded page, i.e. when on the home page, the 'home'
>navigation item should be highlighted.
>>
>I've almost got this working, except for some reason, the highlighted
>background block isn't quite covering the full area of the menu item.
>>
>For example, see this beta page (via TinyURL): http://tinyurl.com/2bk78a
>>
>You can see that the Home navigation item is highlighted in red. This
>looks fine upon first glance, but if you hover over it, you'll see a white
>hover colour 'behind' the red background which shows the full width that
>the menu item should be highlighted in red up to - so there shouldn't be
>any gaps between menu items.

>
Be aware that IE6 does not support :hover on anything other than <a href=>
elements. Your hover does not work in IE6 and causes the the text to be dark
grey on blank, that is unreadable.
>
The standard way is to make the <aelements block (#nav2 a: {display:
block}) and apply your :hover etc to the <a>.

The whole site is in beta mode and I've been working in Safari and
Firefox on the Mac - not yet tested the menu at all in IE6, but I was
led to believe that the JavaScript would make it work in IE6 on the
page where I found the code from:
http://www.htmldog.com/articles/suckerfish/ Maybe I've hacked it
around too much and now it doesn't work.

Can you recommend an alternative open source menu that can look similar
to how I have this menu, but has the hacks for IE in place?

Thanks,

Ste

[Ste]

Re: CSS Menu Highlighting Problem

On 2007-08-26 02:52:46 +0100, dorayme <doraymeRidThis @optusnet.com.a usaid:

In article <46d0d4da$0$210 94$da0feed9@new s.zen.co.uk>,
Ste <23232@23232.co mwrote:
>

>Hi there,
>>
>I'm using CSS to highlight main navigation items in a 'suckerfish menu'
>for the currently loaded page, i.e. when on the home page, the 'home'
>navigation item should be highlighted.
>>
>I've almost got this working, except for some reason, the highlighted
>background block isn't quite covering the full area of the menu item.
>>
>For example, see this beta page (via TinyURL): http://tinyurl.com/2bk78a
>>
>You can see that the Home navigation item is highlighted in red. This
>looks fine upon first glance, but if you hover over it, you'll see a
>white hover colour 'behind' the red background which shows the full
>width that the menu item should be highlighted in red up to - so there
>shouldn't be any gaps between menu items.
>>
>Can anyone tell me why this is happening and how I can fix it please?
>>

>
You could try putting your "current" style on the list item
instead?
>
li#homenav { color:#444444; background: red; }
>
and moving the id to inside the relevant list item. In the case
of the home page it would be:
>
<li id="homenav" style="font-size: 37.4px; line-height:
37.4px;"><a style="font-size: 37.4px; line-height: 37.4px;"
href="http://www.beta.zestim ages.com/">HOME</a>
>
Which very much reminds me to say this design is all hopeless
acrobatics. It is a nice example of an attempt to do things fine
grained in pixels. A nightmare! For a start, see what breaks at a
few clicks of browser text enlargement.

Thanks for the suggestion, I've give it a try. Regarding it all being
hopeless anyway, can you recommend an alternative open source menu that
can look like I want this to look, but also be more accessible and work
in multiple browsers? I'm open to suggestions, and thought this was
the one, but obviously not...

Thanks,

Ste

[Ste]

Re: CSS Menu Highlighting Problem

On 2007-08-26 03:47:46 +0100, "rf" <rf@invalid.com said:

>
"Gus Richter" <gusrichter@net scape.netwrote in message
news:E-Cdnb3uGbnde03bn Z2dnUVZ_qOknZ2d @golden.net...

>Ste wrote:

>>>
>>For example, see this beta page (via TinyURL): http://tinyurl.com/2bk78a

>>
>Why would you use a tinyURL?

>
As the site is in beta the OP might have wanted to keep the real URL
unmentioned, so it wont end up in places like google groups and thus be
prematurely found by the search engines. Begs the question: Does google
follow tinyurl redirections?

That was the intention - so thanks to all those who posted the link
anyway... :-)

Ste

[Ste]

Re: CSS Menu Highlighting Problem

On 2007-08-26 03:46:00 +0100, "Beauregard T. Shagnasty"
<a.nony.mous@ex ample.invalidsa id:

Ste wrote:
>

>Thanks for any advice,

>
How about:
>
body { margin: 0; padding: 0; font-size: 71%; font-family: verdana,
arial, helvetica, sans-serif;

Thanks, I'll give that a try.

>
71% ... and Verdana ... I have to increase text size to read your
content, which is less than 3/4 of my preferred size.
>
See this page:
http://k75s.home.att.net/fontsize.html

I'll check out the link - the site is still in beta so I'm currenly
designing to look as I want before fixing other issues like this.

Also, your page doesn't fit in my browser window without horizontal
scrolling.

I was using an elastic layout which worked down to around 750px wide,
but then checked out my website stats and found that around 98% of my
visitors were using 1024x768 or higher. So I then decided to make it
'easier' for designing the site by switching the width to a fixed 950px
wide - and not penalise the majority for the sake of the minority. Are
you using 800x600? If you're using 1024x768 at maximised browser window
than I have a problem!

Ste

[rf]

Re: CSS Menu Highlighting Problem


"Ste" <23232@23232.co mwrote in message
news:46d15856$0 $21103$da0feed9 @news.zen.co.uk ...

On 2007-08-26 03:46:00 +0100, "Beauregard T. Shagnasty"
<a.nony.mous@ex ample.invalidsa id:

>Also, your page doesn't fit in my browser window without horizontal
>scrolling.

>
I was using an elastic layout which worked down to around 750px wide, but
then checked out my website stats and found that around 98% of my visitors
were using 1024x768 or higher.

The width of your visitors screen has absolutely not bearing on the width of
their browser canvas. Quite the opposite in fact. The wider the screen the
more likelyhood that your visitor has their browser window narrower, so as
to be able to see other things on their desktop at the same time. My
"desktop" is currently about 5000 pixels wide. The bit of my desktop I have
allocated to your site has a horizontal scroll bar.

So I then decided to make it 'easier'

Easier for whom?

for designing the site by switching the width to a fixed 950px wide

Very bad choice. My browser canvas is very rarely that wide.

and not penalise the majority for the sake of the minority. Are you using
800x600?

Irrelevant.

>If you're using 1024x768 at maximised browser window than I have a problem!

Irrelevant. Except that you do have a problem :-)

Design the page so that it adjusts to the width of the browser canvas it is
contained in.

More to the point, do not constrain the page so that it does not adjust to
the browsers canvas width. The default is to use the entire canvas. It is
you who are constraining your page to do otherwise.

Here are two images from a site I administer (for illustration only, totally
compressed to 100%, and carefull, it's still 130K).

http://barefile.com.au/m.jpg

See any scrollbars? Any empty space?

--
Richard.

[Beauregard T. Shagnasty]

Re: CSS Menu Highlighting Problem

Ste wrote:

"Beauregard T. Shagnasty" said:

>Ste wrote:

>>Thanks for any advice,

>>
>How about:
>>
>body { margin: 0; padding: 0; font-size: 71%; font-family: verdana,
>arial, helvetica, sans-serif;

>
Thanks, I'll give that a try.

The above is what you already have. I copied it here to show you and
other readers your use of 71% font size, and Verdana.

>71% ... and Verdana ... I have to increase text size to read your
>content, which is less than 3/4 of my preferred size.
>>
>See this page: http://k75s.home.att.net/fontsize.html

>
I'll check out the link - the site is still in beta so I'm currenly
designing to look as I want before fixing other issues like this.

The page says use 100% for your base/content font size, and drop
Verdana. You should fix this first, before attempting other fixes, to
make sure your content fits within any sized boxes/divs, and does not
overflow if someone with poor vision increases it by up to .. 150%?

>Also, your page doesn't fit in my browser window without horizontal
>scrolling.

>
I was using an elastic layout which worked down to around 750px wide,
but then checked out my website stats and found that around 98% of my
visitors were using 1024x768 or higher. So I then decided to make it
'easier' for designing the site by switching the width to a fixed
950px wide - and not penalise the majority for the sake of the
minority. Are you using 800x600? If you're using 1024x768 at
maximised browser window than I have a problem!

Screen resolution is unimportant. Browser window size is important. My
screen resolution is higher than 1024, but my browser window is not
full-screen. At that moment it was to the left on my screen, and
approximately 700 wide by 900 tall.

I was working with web info in one window, and an editor in another,
positioned beside the browser. This is not uncommon.

--
-bts
-Motorcycles defy gravity; cars just suck

[Ben C]

[OT] Ford POS

On 2007-08-26, dorayme <doraymeRidThis @optusnet.com.a uwrote:
[...]

[Anyone the slightest bit interested to know if I succeeded in
replacing the power booster in my Ford XY yesterday _without_
disconnecting the master cylinder? Can anyone smell any brake fluid
over my words here?]

Yes I am quite interested. What is a "power booster"? Do you mean the
servo? Have you tried uk.rec.cars.mai ntenance? It's not a bad NG with a
few people who really know what they're talking about. I particularly
recommend "Mr Cheerful". There is also an Andy Dingley who posts there
occasionally.

[dorayme]

Re: [OT] Ford POS

In article <slrnfd67vn.5hv .spamspam@bowse r.marioworld>,
Ben C <spamspam@spam. eggswrote:

On 2007-08-26, dorayme <doraymeRidThis @optusnet.com.a uwrote:
[...]

[Anyone the slightest bit interested to know if I succeeded in
replacing the power booster in my Ford XY yesterday _without_
disconnecting the master cylinder? Can anyone smell any brake fluid
over my words here?]

>
Yes I am quite interested. What is a "power booster"? Do you mean the
servo? Have you tried uk.rec.cars.mai ntenance? It's not a bad NG with a
few people who really know what they're talking about. I particularly
recommend "Mr Cheerful". There is also an Andy Dingley who posts there
occasionally.

<http://netweaver.com.a u/images/PBXWY.jpg>

It sits on the firewall, and simply pushes the piston in the
master cylinder, no "mechanical " connection.

Anyway, no I did not succeed in the "short method" mentioned. It
was impossible to replace it without disconnecting the master
cylinder. Not for want of trying at every angle and more. Could
not be done in my particular model (without caving in a double
steel plated well in the way that contained the front coil). So
all the dramas of freeing and refitting very old pipe threads
ensued. Into the dark of early evening. It was ok. The worst bit
was actually getting one particular nut off a bolt to free the
bracket holding the booster onto the firewall from under the
dash. There is a hump for the gearbox in the cabin, making it a
very unfriendly place to lie, backbreaking! Luckily, I brought
along a mate who can accept reconfiguration of body, I removed
his legs as well as his left arm and head (it was simple enough
work to allow the latter).

I had to return the old booster (exchange deal) and could not
satisfy my curiosity, I had a theory about what was wrong inside,
I diagnosed an internal valve fault. Looked into opening and
fixing but parts were not certain and time was not on my side,
nor experience in such things from others (no one does these
things nowadays). I notice the pros did what I had planned, a
metal band with a nut and bolt to tighten around to close the
thing shut and tight. The factory jobs are not user friendly to
open, press fitted as you can see from the pics. There is a
powerful spring inside and opening and closing is tricky work.

Thanks for the link, must look at it. Very bush mechanical around
my old Ford, no fine work. I reckon Englishman would be appalled
at the way the colonials make do...

--
dorayme

[Ben C]

Re: [OT] Ford POS

On 2007-08-27, dorayme <doraymeRidThis @optusnet.com.a uwrote:

In article <slrnfd67vn.5hv .spamspam@bowse r.marioworld>,
Ben C <spamspam@spam. eggswrote:
>

>On 2007-08-26, dorayme <doraymeRidThis @optusnet.com.a uwrote:
>[...]

[Anyone the slightest bit interested to know if I succeeded in
replacing the power booster in my Ford XY yesterday _without_
disconnecting the master cylinder? Can anyone smell any brake fluid
over my words here?]

>>
>Yes I am quite interested. What is a "power booster"? Do you mean the
>servo?

[...]

><http://netweaver.com.a u/images/PBXWY.jpg>
>
It sits on the firewall, and simply pushes the piston in the
master cylinder, no "mechanical " connection.

That's right, that's what we call the "servo". Over here the power
booster is what we call the red button inside the gear knob that you
push when you need to overtake.

Anyway, no I did not succeed in the "short method" mentioned. It
was impossible to replace it without disconnecting the master
cylinder. Not for want of trying at every angle and more. Could
not be done in my particular model (without caving in a double
steel plated well in the way that contained the front coil).

Probably not a good idea, you do need those strut mounts. It's important
when judging whether to cave in bodywork to distinguish the functional
from the merely cosmetic.

all the dramas of freeing and refitting very old pipe threads
ensued. Into the dark of early evening. It was ok.

It's often surprisingly not that bad to disturb the hydraulics. Some
people even undo the bleed screws to facilitate retracting the pistons
when changing the pads. I think that's unnecessary but there's a school
of thought that says that if you operate the bleed screws quite
regularly they're less likely to get seized and therefore rounded or
broken when you do need to move them.

The worst bit was actually getting one particular nut off a bolt to
free the bracket holding the booster onto the firewall from under the
dash. There is a hump for the gearbox in the cabin, making it a very
unfriendly place to lie, backbreaking!

I hate things under the dash. Even worse than lying under the car with
brake fluid dripping onto one's face.

[...]

I had to return the old booster (exchange deal) and could not
satisfy my curiosity, I had a theory about what was wrong inside,
I diagnosed an internal valve fault.

Perhaps. I think those things also have a rubber diaphragm which is
therefore subject to perishing and splitting. This is one reason not to
get the replacement from a scrapyard. The same applies to cam-operated
mechanical fuel pumps.

Looked into opening and fixing but parts were not certain and time was
not on my side, nor experience in such things from others (no one does
these things nowadays). I notice the pros did what I had planned, a
metal band with a nut and bolt to tighten around to close the thing
shut and tight.

I think that's a "jubilee clip".

[Andy Dingley]

Re: [OT] Ford POS

On Mon, 27 Aug 2007 14:03:33 -0500, Ben C <spamspam@spam. eggswrote:

>There is also an Andy Dingley who posts there occasionally.

_Very_ rarely.

And I prefer PHP to Fords.