Saturday, 17 August 2013

How can I get these two widgets to align horizontally using CSS selectors?

How can I get these two widgets to align horizontally using CSS selectors?

I created an area in my WordPress theme where I can include a widget.
Well, I included a social follow widget and I also included a Facebook
Follow/Subscribe widget.
The problem is that the Facebook widget appears below the social widget --
and I'd like the social widget to be flush left, and the facebook widget
to flush right.
Here is what it looks like on the website:

And here is the "general" Firebug of it:

I have tried to learn CSS, but I still get confused with selectors and the
differences between text-align:left or float:left, etc. ... Here is what
it looks like when you open up those "asides" in firebug:

I must have tried 30 different types of CSS rules and I cannot get that
Facebook Follow widget to show up on the same line as the social widget,
flushed right.
I can say that the one thing that I've tried that has worked for me has
been this:
#social_sprites_widget-6 .ss {
text-align: left;
}
#social_sprites_widget-6 .widgettitle {
color: white!important;
text-align: left;
}
That has gotten the social sprites and title to flush left. But I cannot
do anything with the Facebook follow widget. Any help in eliminating this
headache would be greatly appreciated!

No comments:

Post a Comment