|
| |
|
|
boonedawg
Posts: 36
Joined: 4/8/2006
Status: offline
 |
Unordered List Styles - 6/10/2006 17:30:56
How can I create the same effect as:
.navTitle {
width: 178px;
font-weight: bold;
color: #011750;
padding: 2px 0 2px 5px;
margin: 0;
}
.navSubTitle {
width: 178px;
font-weight: bold;
font-size: 11px;
padding-left: 5px;
margin: 0;
}
but also validate? I see now the you can not have div tags within a list. Is this possible to achive this effect?
|
|
|
|
boonedawg
Posts: 36
Joined: 4/8/2006
Status: offline
|
RE: Unordered List Styles - 6/11/2006 0:55:21
Ok I tried some nested lists and failed miserably, lol.
What I am trying to do is make a navigation that looks like the one I have here.
If anyone can help me out with this code it would be greatly appreciated.
| |
|
|
|
Tailslide
Posts: 6121
Joined: 5/10/2005
From: Out here on the raggedy edge
Status: offline
|
RE: Unordered List Styles - 6/11/2006 4:25:08
Here you go: Menu Test Page
There are several different ways to do the active menu item - I've used the easiest to understand - i.e. given the "active item" a different class to all the other items. The drawback to this is that you need to do this on every page which is a pain.
The method I use which you might want to have a play with once you get this fixed up is to assign an id to the body element on each page. Then you assign and id to each menu item.
Then in your CSS you add a rule to say basically when the body id=whatever then a particular menu id item will be "active" like this (simplified)
<body id="home">
<ul>
<li><a href="index.html" id="nav-home">Home</a></li>
<li><a href="about.html" id="nav-about">About</a><li>
<li><a href="contact.html" id="nav-contact">Contact</a></li>
</ul>
CSS:
#home #nav-home, #about #nav-about, #contact #nav-contact {whatever rules}
The advantage of doing it this way is that you have the same menu on every page - you can stick the lot in an include if you like.
The only disadvantage in your case would be working out the rules as you sometimes have two items "active" at the same time (e.g. haircare and hairdryers).
< Message edited by Tailslide -- 6/11/2006 4:35:37 >
_____________________________
"My strategy is so simple an idiot could have devised it"
Little Blue Plane Web Design | Blood, Sweat & Rust - A Land Rover restoration project
| |
|
|
|
boonedawg
Posts: 36
Joined: 4/8/2006
Status: offline
|
RE: Unordered List Styles - 6/13/2006 13:08:23
Tailslide,
Thank you so much for the menu, it works great. I tried replying to your message but both times it failed, lol. There was one thing that I tried to modify in this list but I am unable to do it. I would like to make the sub links non bold, I could only seem to get it to work for the hover state. Anyway it looks good as is, and I appreciate all your help with this matter.
| |
|
|
|
Tailslide
Posts: 6121
Joined: 5/10/2005
From: Out here on the raggedy edge
Status: offline
|
RE: Unordered List Styles - 6/13/2006 13:22:23
Just add in
#navcontainer ul ul a:link {font-weight:normal;}
and that will get the sub-sub menu links back to normal weight in FF, Moz, Opera etc. In IE they were already non-bold.
_____________________________
"My strategy is so simple an idiot could have devised it"
Little Blue Plane Web Design | Blood, Sweat & Rust - A Land Rover restoration project
| |
|
|
|
boonedawg
Posts: 36
Joined: 4/8/2006
Status: offline
|
RE: Unordered List Styles - 6/13/2006 15:45:33
Thank you so much Tailslide for all your help. Everyone on this site is so helpful, I am glad to be apart of these forums. The menu bar works great, my next mission is to get all the pages to work in IE, I redid my css layout on the index page and it works, just need to do the other pages now. After I have completed that I will need some assistance in making my html and css validate, there are some things I still don't understand, but I know with the help from people in these forums I will get this done. Thanks to everyone who has taken the time to help me out.
| |
|
 New Messages |
 No New Messages |
 Hot Topic w/ New Messages |
 Hot Topic w/o New Messages |
 Locked w/ New Messages |
 Locked w/o New Messages |
|
Post New Thread
Reply to Message
Post New Poll
Submit Vote
Delete My Own Post
Delete My Own Thread
Rate Posts
|
|
|
Printable Version 
