|
|
|
|
||||||
![]() |
|
|
LinkBack | Outils de la discussion |
|
|
#1 |
|
Messages: n/a
Hébergeur: |
On 24 fév, 09:48, totalstranger <totalstran...@not.yahoo.net> wrote:
> Can someone please take a look at this and give some suggestions.http://www.arnb.org/testmenu.html Hello, I checked your stylesheet and I saw a few problems: /* Set up the first level list items */ #nav li { position:relative; /* this allows positioning of second level */ display: inline; /* show as a horizontal line */ } but that's not the correct CSS rule for the first level items. The correct rule is: #nav > li { position:relative; /* this allows positioning of second level */ display: inline; /* show as a horizontal line */ } and when correcting such CSS rule, that makes this other CSS hack [ background:transparent url(IMAGES/transparent.gif);/*forces IE7 to work without scripting*/ /* otherwise secondary menu blanks out on a hover*/ ] ... completely useless, pointless: so, you can remove that background: transparent url(...); declaration entirely. Some other points: #nav, #nav ul { /* all lists */ padding: 0; margin: 0; list-style: none; font-weight:normal; text-align: center; } can be better replaced by ul { padding: 0; margin: 0; list-style: none; text-align: center; /* although we explained centering is not best */ } Also The selector #nav li ul li a, #nav li ul li a:visited { ... } can be better replaced by #nav ul a, #nav ul a:visited { ... } You may think those changes are cosmetic but they in fact parse the CSS code faster and with lesser chances of triggering bugs in browsers. I then checked in Opera 9.26 and my demo works .. although Opera 9.26 is a bit iffy. It works better in Opera 9.50 build 9807 though. Regards, Gérard |
|
|
|
#2 |
|
Messages: n/a
Hébergeur: |
On or about 2/29/2008 1:48 AM, it came to pass that GTalbot wrote:
> On 24 fév, 09:48, totalstranger <totalstran...@not.yahoo.net> wrote: > >> Can someone please take a look at this and give some suggestions.http://www.arnb.org/testmenu.html > > Hello, > > I checked your stylesheet and I saw a few problems: > > /* Set up the first level list items */ > #nav li { > position:relative; /* this allows positioning of second level */ > display: inline; /* show as a horizontal line */ > } > > but that's not the correct CSS rule for the first level items. The > correct rule is: > > #nav > li { > position:relative; /* this allows positioning of second level */ > display: inline; /* show as a horizontal line */ > } > > and when correcting such CSS rule, that makes this other CSS hack > [ > background:transparent url(IMAGES/transparent.gif);/*forces IE7 to > work without scripting*/ > /* otherwise secondary menu blanks out on a hover*/ > ] > > ... completely useless, pointless: so, you can remove that > background: transparent url(...); > declaration entirely. > > Some other points: > > #nav, #nav ul { /* all lists */ > padding: 0; > margin: 0; > list-style: none; > font-weight:normal; > text-align: center; > } > > > can be better replaced by > > ul > { > padding: 0; > margin: 0; > list-style: none; > text-align: center; /* although we explained centering is not best */ > } > > > Also > > The selector > #nav li ul li a, #nav li ul li a:visited { ... } > can be better replaced by > #nav ul a, #nav ul a:visited { ... } > > You may think those changes are cosmetic but they in fact parse > the CSS code faster and with lesser chances of triggering bugs in > browsers. > > I then checked in Opera 9.26 and my demo works .. although Opera 9.26 > is a bit iffy. It works better in Opera 9.50 build 9807 though. > > Regards, Gérard Gérard Just want to thank you for providing your excellent suggestions and taking the time to look at this code. Also thanks to everyone else who responded, even when the suggestions were not easy for me to accept. I have much more to learn about CSS. |
|
|
|
#3 |
|
Messages: n/a
Hébergeur: |
On or about 3/10/2008 11:37 PM, it came to pass that totalstranger wrote:
> On or about 2/29/2008 1:48 AM, it came to pass that GTalbot wrote: >> On 24 fév, 09:48, totalstranger <totalstran...@not.yahoo.net> wrote: >> >>> Can someone please take a look at this and give some >>> suggestions.http://www.arnb.org/testmenu.html >> >> Hello, >> >> I checked your stylesheet and I saw a few problems: >> >> /* Set up the first level list items */ >> #nav li { >> position:relative; /* this allows positioning of second level */ >> display: inline; /* show as a horizontal line */ >> } >> >> but that's not the correct CSS rule for the first level items. The >> correct rule is: >> >> #nav > li { >> position:relative; /* this allows positioning of second level */ >> display: inline; /* show as a horizontal line */ >> } >> >> and when correcting such CSS rule, that makes this other CSS hack >> [ >> background:transparent url(IMAGES/transparent.gif);/*forces IE7 to >> work without scripting*/ >> /* otherwise secondary menu blanks out on a hover*/ >> ] >> >> ... completely useless, pointless: so, you can remove that >> background: transparent url(...); >> declaration entirely. >> >> Some other points: >> >> #nav, #nav ul { /* all lists */ >> padding: 0; >> margin: 0; >> list-style: none; >> font-weight:normal; >> text-align: center; >> } >> >> >> can be better replaced by >> >> ul >> { >> padding: 0; >> margin: 0; >> list-style: none; >> text-align: center; /* although we explained centering is not best */ >> } >> >> >> Also >> >> The selector >> #nav li ul li a, #nav li ul li a:visited { ... } >> can be better replaced by >> #nav ul a, #nav ul a:visited { ... } >> >> You may think those changes are cosmetic but they in fact parse >> the CSS code faster and with lesser chances of triggering bugs in >> browsers. >> >> I then checked in Opera 9.26 and my demo works .. although Opera 9.26 >> is a bit iffy. It works better in Opera 9.50 build 9807 though. >> >> Regards, Gérard > Gérard > Just want to thank you for providing your excellent suggestions and > taking the time to look at this code. Also thanks to everyone else who > responded, even when the suggestions were not easy for me to accept. I > have much more to learn about CSS. > > Unfortunately about 43% of folks looking at my site are using IE6 which does not eat most CSS selectors including child selectors (>). Kind of suspect many of them are Windows 2000 in corporate offices. Since I already adjust for IE and the rest of the browser universe, it's a simple matter to another css file for IE6. Arn |
|
![]() |
| Outils de la discussion | |
|
|