Products

Solutions

Resources

Partners

Community

Blog

About

QA

Ideas Test

New Community Website

Ordinarily, you'd be at the right spot, but we've recently launched a brand new community website... For the community, by the community.

Yay... Take Me to the Community!

Welcome to the DNN Community Forums, your preferred source of online community support for all things related to DNN.
In order to participate you must be a registered DNNizen

HomeHomeUsing DNN Platf...Using DNN Platf...Skins, Themes, ...Skins, Themes, ...Overwrite classOverwrite class
Previous
 
Next
New Post
2/5/2009 11:46 AM
 

Hi!

I have issue with css. Maybe someone know this... I wrote css class A:link in skin.css which is default DNN class for links. So, if I have some links on my site on which I want different color from what is configured on mentioned class, how do I do that?

I tried put different class for that link and configure style in html, but it always uses this A:link class.

Can anyone know how to troubleshoot this?

Thanks, Ivan

 
New Post
2/5/2009 12:17 PM
 

Hi Ivan,

don't know if i have the Solution, but i have something to think about.
This is the way how the CSS Files are loaded into a Portal:

1. module.css
2. default.css
3. skin.css
4. container.css
5. portal.css

So if you put a Containr around the Links you would like to have a different Color, i assume that if you put attributes into the according container.css, this should work. Give it a try...



Herzliche Grüße aus Hückelhoven
Frank Wahl
www.eagleworx.net

EagleworX.net
 
New Post
2/5/2009 2:42 PM
 

It's rather easy to do, and several approaches.

1) if you assign the class like "newlinkstyle" to the link you are styling, then in skin.css you enter:

a.newlinkstyle:link, a.newlinkstyle:visited, a.newlinkstyle:active { your styles here for color }
a.newlinkstyle:hover { your hover colors here }

2) With the container method, you can assign different colored text for anything you want.  In your containers have a "wrapper" class that contains the container html.  Then in container.css you can do the following.  If your "wrapper" class is actually called "containerwrapper1":

.containerwrapper1 a:link, a:visited, a:active { specific colors to assign any container with that wrapper class }

So, you can assign different wrapper classes to different containers and have entirely different styles for everything from headers, subheads, normaltext, etc. 

It's all about following the cascade of the stylesheets and the styles themselves.  You might also want to look at "Firebug" free extension for FireFox.  I use that exclusively when developing a skin to be able to "inspect" elements and the heirarchy of classes assigned to them.  Firebug is invaluable must have tool for help with assigning and styling classes in DNN skins.

Hope that helps,

Rick


JOHN GIESY
DotNetNuke Hosting Expert

DotNetNuke 7 Hosting $70 /year
DNN4Less.com Team DotNetNuke  

New Post
2/6/2009 11:08 AM
 

Thanks guys for such good reply and help. It was very useful.

Firebug is great troubleshooting tool and was helpful in solving this problem. I had td class overwrite.

Thanks!

-Ivan

 
Previous
 
Next
HomeHomeUsing DNN Platf...Using DNN Platf...Skins, Themes, ...Skins, Themes, ...Overwrite classOverwrite class


These Forums are dedicated to discussion of DNN Platform and Evoq Solutions.

For the benefit of the community and to protect the integrity of the ecosystem, please observe the following posting guidelines:

  1. No Advertising. This includes promotion of commercial and non-commercial products or services which are not directly related to DNN.
  2. No vendor trolling / poaching. If someone posts about a vendor issue, allow the vendor or other customers to respond. Any post that looks like trolling / poaching will be removed.
  3. Discussion or promotion of DNN Platform product releases under a different brand name are strictly prohibited.
  4. No Flaming or Trolling.
  5. No Profanity, Racism, or Prejudice.
  6. Site Moderators have the final word on approving / removing a thread or post or comment.
  7. English language posting only, please.
What is Liquid Content?
Find Out
What is Liquid Content?
Find Out
What is Liquid Content?
Find Out