Probably very simple, but...

[TopDawg]

On my blog, I have HTML nuggets in the sidebar. I wanted the links in the sidebar to be a different style than the body, so I added the following:

Code: Select all

div.serendipitySideBarContent a:link {
  color: #392310;
  text-decoration: none;	
}

div.serendipitySideBarContent a:visited {
	  color: #DF6108;
	  text-decoration: none;
}

div.serendipitySideBarContent a:active {
  color: #DF6108;
  text-decoration: underline;	
}

div.serendipitySideBarContent a:hover {
	  color: #392310;
  text-decoration: underline;
}

The only problem is that the first link in the nuggets comes up the same as my body links (unless I add an inline style to it). Is there something I'm missing?

You can see what I'm talking about under the "Navigation" nugget: www.dawg-pound.net

[d_cee]

Hi
why not put your links in a div in your navigation HTML nugget and give it's own class say 'nugget_links' so you'd have:

Code: Select all

<div class="nugget_links">
put your links here
</div>

then in your style.css

Code: Select all

.nugget_links a:link {
  color: #392310;
  text-decoration: none;   
}

.nugget_links a:visited {
     color: #DF6108;
     text-decoration: none;
}

.nugget_links a:active {
  color: #DF6108;
  text-decoration: underline;   
}

.nugget_links a:hover {
     color: #392310;
  text-decoration: underline;
}

that should do it

HTH

Dave

[TopDawg]

Well I just tried that to no avail...I'm going to put style inline for now...

[Don Chambers]

The reason is your color. Your first link is "home". You have obviously hit that page, so the style that applies to that link is a:visited. That color is the the same as your other links.

Code: Select all

div.serendipitySideBarContent a:visited {
     color: #DF6108;
     text-decoration: none;
}

Change the color to #392310 if you always want it to be the brown-ish color instead of orange... same for "active".

Styling serendipitySideBarContent, as you have done, will apply to ALL sidebar links. If that is what you want... great. If you want to change ONLY the links in your nuggets, which seems to be how d_cee interpreted your request, you do not need a new class... the html nugget plugin already emits its own class of .container_serendipity_html_nugget_plugin, so adding rules for that selector will apply only to html nuggets, and ONLY if the rules come after any rules for other types of links (hope that made sense).

So, if you want all sidebar links to be brown all the time, and underlined on hover and active, this would work:

Code: Select all

div.serendipitySideBarContent a:link,
div.serendipitySideBarContent a:visited {
  color: #392310;
  text-decoration: none;   
}

div.serendipitySideBarContent a:hover,
div.serendipitySideBarContent a:active {
  color: #392310;
     text-decoration: underline;
}

[TopDawg]

It's magic! thanks both of you!