7 replies [Last post]
MaxHeight
Offline
Regular
Last seen: 11 years 49 weeks ago
Joined: 2008-03-06
Posts: 12
Points: 0

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;
}

ifohdesigns
ifohdesigns's picture
Offline
Enthusiast
Providence, RI
Last seen: 9 years 18 weeks ago
Providence, RI
Timezone: GMT-4
Joined: 2008-02-22
Posts: 269
Points: 0

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?

mattrossidesigns.com

MaxHeight
Offline
Regular
Last seen: 11 years 49 weeks ago
Joined: 2008-03-06
Posts: 12
Points: 0

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

MaxHeight
Offline
Regular
Last seen: 11 years 49 weeks ago
Joined: 2008-03-06
Posts: 12
Points: 0

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.

http://www.circlesoflight.net/index2.html

ifohdesigns
ifohdesigns's picture
Offline
Enthusiast
Providence, RI
Last seen: 9 years 18 weeks ago
Providence, RI
Timezone: GMT-4
Joined: 2008-02-22
Posts: 269
Points: 0

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

  • mattrossidesigns.com

    wolfcry911
    wolfcry911's picture
    Offline
    Guru
    MA, USA
    Last seen: 6 years 47 weeks ago
    MA, USA
    Timezone: GMT-5
    Joined: 2004-09-01
    Posts: 3224
    Points: 237

    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 { }

    MaxHeight
    Offline
    Regular
    Last seen: 11 years 49 weeks ago
    Joined: 2008-03-06
    Posts: 12
    Points: 0

    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.

    thepineapplehead
    thepineapplehead's picture
    Offline
    Guru
    Last seen: 45 weeks 9 hours ago
    Joined: 2004-06-30
    Posts: 9668
    Points: 801

    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

    Verschwindende wrote:
    • CSS doesn't make pies