Archived

This topic is now archived and is closed to further replies.

  • 0

Right Rail Widget Styling


Question

Posted · Report post

Hi there,

 

I'm trying to modify the styles of the right rail widget and have found the attributes in Firebug, but am unable to find the selector (#)

 

Here are the attributes I am trying to modify to make the heading bigger, remove the extra padding, add a slight grey background, and a thing rounded border. 

 

.widget .widget-title {
    color: rgba(0, 0, 0, 0.7);
    margin-bottom: 0.6em;
    padding: 3px 8px 3px 0;
    text-align: left;

 

When I add a value to change the size of the heading or the color and add to the Custom CSS code, the changes are not reflected upon save.

 

The relevant URL is: http://mindfulbaby.com/category/pattern-category/

 

Thanks

 

 

 

Share this post


Link to post
Share on other sites

3 answers to this question

Posted · Report post

HI

In my firebug this work fine, I try with

 

 

.widget .widget-title {
    color: rgba(0, 0, 0, 0.1);
    text-align: right;
    padding: 3px 8px 3px 0px;
    margin-bottom: 0.9em;
}

You see this

Captura%2520de%2520pantalla%25202012-12-

 

To verify, please you don´t forget the final "}" and clean de cache after the change.
;)

Share this post


Link to post
Share on other sites

Posted · Report post

Thanks for replying - isn't the selector supposed to start with a #? That's what I'm looking for because as is the .widget revision (with cache clearing) is not working. 

 

Thanks, Kristin

Share this post


Link to post
Share on other sites

Posted · Report post

The # isn't a prefix for all elements.  For example, you can uses it for #boxes, but if you want the image in a box, it's .fbox.  If you're writing code for the body, it's just body, with no prefix.

 

This site might help you improve your understanding of styling elements: http://www.w3schools.com/css/

Share this post


Link to post
Share on other sites