ThemeShaper Forums » Power Blog

[closed]

How to specifically style the links in primary aside

(5 posts)
  1. sober
    Member

    Hi

    I am using the power blog theme and i can see the CSS entries

    .crown-aside a {
    color:#ffffff;
    }
    .crown-aside a:active,
    .crown-aside a:hover {
    color: #990033;
    }

    wherein i can style the crown aside . I want to style the links of the primary aside and for that I replaced the crown with primary of the above entries but that did not worked. Also tell me in which theme's style sheet I will have to insert the entries.

    Posted 9 years ago #
  2. You should not put any custom css edits into the thematic parent theme directory. I believe all of your css changes should be put into the style.css of the powerblog theme. Note I have not purchased that theme so I dont know if there were any special considerations for custom css for that child theme. Just to be safe you should look for any documentation that might have been included in the powerblog theme directory for more accurate instructions regarding where to put your custom styles.

    Here is an important concept that will help you better understand make these changes yourself : specificity (clicky for tutorial link)

    Also knowing how to use firebug to easily look (YouTube) at what styles are applied and where they are applied is something I suggest you look in to trying.

    Posted 9 years ago #
  3. sober
    Member

    Thank GOD and GOD only, I found it after some trial and error. It now appears just a matter of cut and paste.

    #primary a {
    color:#000000;
    }
    #primary a:active,
    #primary a:hover {
    color: #0000ff;
    }
    #leader a {
    color:#000000;
    }
    #leader a:active,
    #leader a:hover {
    color: #0000ff;
    }
    #secondary {
    background:#ffcc00;
    border:0px solid #ccc;
    border-width:0 0px 0px 0px; /* keeping a border on the left for no-js */
    margin-left:-1px; /* offsets the 1px border on the left */
    padding:22px 0 11px 0;
    width:356px;
    }
    #secondary a {
    color:#000000;
    }
    #secondary a:active,
    #secondary a:hover {
    color: #0000ff;
    }

    To style a specific aside , foe ex: the 1st leader aside, you would add

    #leader #first-leader a {
    color:#99ffcc;
    }
    #leader #first-leader a:active,
    #leader #first-leader a:hover {
    color: #99ccff;
    }

    or to style the links of a specific subsidiary in footer

    #subsidiary #second a {
    color:#99ffcc;
    }
    #subsidiary #second a:active,
    #subsidiary #second a:hover {
    color: #99ccff;
    }

    and so on and on and on (at least for me)

    Posted 9 years ago #
  4. These kind of problems are usually solved by one of two things trail and error or pure genius. In my case the former is usually the case. I'm glad you found a solution.

    Posted 9 years ago #
  5. sober
    Member

    Thanks em hr, for the encouragement . I understand that these are only a tip of the ice berg...

    Posted 9 years ago #

RSS feed for this topic

Topic Closed

This topic has been closed to new replies.