I have 2 menus and I want to set an id="current" for both.
The first menu uses id="current"
the second menu uses id="side_current"
The first menu works fine.
I've tried every possiple combination of css I could think of for the second menu but it doesn't work.
HTML:
- What We Believe
- 2008 Calendar of Events
- Sared Cities Tours
- B.R.O.T.H.E.R.S.
- F.L.O.W.E.R.S.
- COLM Merchadise
- The I AM Institute
- I AM Class Roll Call
- Newsletter Sign Up
CSS:
#current a{
color: #0b6301;
background-color: #6edc75;
padding: 0 10px 0 10px;
margin-right: 20px;
}
#side_current a:link{
color: #6edc75;
background-color:#0b6301;
}
could you just post all your
could you just post all your html and css so we can have a better look at what is going on.
I am just trying to figure out what you are trying to do here. Are you talking about making a "current" or selected state for the links?
OOPS!! Forgot comment tags.
- What We Believe
- 2008 Calendar of Events
- Sared Cities Tours
- B.R.O.T.H.E.R.S.
- F.L.O.W.E.R.S.
- COLM Merchadise
- The I AM Institute
- I AM Class Roll Call
- Newsletter Sign Up
Yes. I'm trying to make a
Yes. I'm trying to make a "current" state for both menus.
Check out my test site and perhaps that will clear up the confusion.
You have a few options.
You have a few options. Depending on the styling you want applied to the "current" state. If you want the main menu "current" to be the same as the sidebar, then you can apply a class to the . If you are using id's you have to remember that you can't have the same id appear twice as they are unique.
So for example:
#menu ul li#current a {
color: #000;
background: #fff; /* or whatever color you want */
}
#left_panel ul li#anotherId a {
color: #eee;
background: #999;
}
OR
ul li.current a {
color: #000;
background: #fff;
}
You would just have to alter the markup to have that class applied to the current
The problem lies with
The problem lies with specificity. You need to make the selector have a higher weight to overrule a following declaration. Try this:
#left_panel #side_current a { }
AWESOME!! That did it! I was
AWESOME!!
That did it!
I was certain I tried that before, but glad it's working now.
Thanks!
BTW
Do you know what happens when you add a # after the html extension in a hyperlink?
Example:
Home
I've experimented with it several time and it seems to jumpstar rollovers that weren't working working before, but you have to eventually take it out as it causes other problems later. I can't find any info on it anywhere on the web. Very curious though.
It's used to target specific
It's used to target specific parts of pages, eg <a href="page.html#bottom"> would target <p id="bottom"> on page.html