Forums

bobrast

I'm building out a Bootstrap responsive site and can't get the sidebar nav links to highlight when the linked page is active. Dunno if I'm leaving out something, but here's the sidebar nav code:

  <div class="side-nav sidebar-block right-side-nav">
  <ul>
    <li class="first-nav-child"><a href="index.php" title="IANA O&amp;M Seminar Overview">O&M Seminar Overview</a>
      <div class="side-tick left-side-tick"></div>
    </li>
    <li class="active"><a href="program.php" title="IANA O&amp;M Seminar Program">Program</a>
      <div class="side-tick left-side-tick"></div>
    </li>
    <li><a href="sessions.php" title="IANA O&amp;M Seminar Sessions">Sessions</a>
      <div class="side-tick left-side-tick"></div>
    </li>
    <li><a href="speakers.php" title="IANA O&amp;M Seminar Speakers">Speakers</a>
      <div class="side-tick left-side-tick"></div>
    </li>
    <li><a href="sponsorship.php" title="IANA O&amp;M Seminar Sponsorship">Sponsorship</a>
      <div class="side-tick left-side-tick"></div>
    </li>
    <li><a href="registration.php" title="IANA O&amp;M Seminar Registration">Registration</a>
      <div class="side-tick left-side-tick"></div>
    </li>
    <li><a href="housing.php" title="IANA O&amp;M Seminar Housing">Housing</a>
      <div class="side-tick left-side-tick"></div>
    </li>
    <li><a href="golf.php" title="IANA O&amp;M Seminar Golf">Golf</a>
      <div class="side-tick left-side-tick"></div>
    </li>
  </ul>
  </div>

All of the solutions I find online suggest that I have to use SASS or Less to get the active links set. I'd like to not use them. Any ideas?

Many thanks,

Bob

Paulie_D

Your HTML won't help we'd need to see the CSS.

Do you have a live link?

SASS/LESS is just another way of writing CSS...not sure that will help.

However, there are a couple of ways of setting an 'active' class. Javascript is one, but there are others.

Paulie_D

Here's something I googled...the CSS way: http://csscreator.com/topic/css-current-page-nav-link-highlight

bobrast

Thanks for that link, Paulie. As I read about giving the body tag a unique ID, I had one of those "duh" moments that spur the memory ... appreciate it!

treehouse : what would you like to learn today?

Forums

[Solved] Bootstrap Active Links Problem