Skip to:
Content
Pages
Categories
Search
Top
Bottom

Re: Widget CSS alteration


Burt Adsit
Participant

@burtadsit

http://www.cssbasics.com/chapter_7_css_margins.html

http://www.cssbasics.com/chapter_8_css_padding.html

Margin or padding the left edge of the containing div for whatever widget you are interested in is the way to go probably. First install firebug to figure out what to alter and what the current settings are: http://getfirebug.com/

That will tell you what you need to change and even allow you to interactively change css to try before you buy. You need to override the css in your theme\\\’s site-wide.css file. Create one in your theme\\\’s /theme/css directory. Create the \\\’css\\\’ directory if it doesn\\\’t exist.

Example: move the site wide activity widget 3px to the right in the bp home theme if it\\\’s activated in the left-column.

1) Create: /wp-content/themes/buddypress-home/css/site-wide.css

2) Firebug says that the containing div is: \\\’buddypress-activity\\\’ and has the classes: \\\’widget\\\’ and \\\’bp_activity_widget_sitewide_activity\\\’

3) In site-wide.css we override the default setting for class bp_activity_widget_sitewide_activity which is specific to this widget and firebug tells me that nothing is modifying this class yet. So we do:

.bp_activity_widget_sitewide_activity{

margin-left: 3px;

}

I should stick to programming. I really suck at css so that may cause your server to have a meltdown and your children to talk back to you. :)

Skip to toolbar