Align Widgets Horizontally (in Header Right)

[JingDoc]

I had two text widgets in the "Header Right" widget (of Outreach theme). I wanted to align them horizontally (side-by-side) rather than vertically, and thought I would share the instructions that I received Hope it helps someone else!

You can float 2 widgets side by side by targeting them by Widget ID like this:

#text-2 {
float: left;
}

#text-3 {
float: right;
}

http://css-tricks.com/all-about-floats/
http://wpfab.com/how-to-customize-a-specific-wordpress-widget/

If you're doing this for your header widget area, you would also need to change the width of the header widget area to be wider:
#header .widget-area {
float: right;
height: 100px;
margin: 10px 0 0;
width: 415px;
}

[Susan]

Thanks for the tip!

[2FlyGirls]

I could use some help -
I put a Search Widget in the Header Right section and the white search box fills between the header area and the header right area. I would like to align it so it is in the middle of the header right area.
Also, in Internet Explorer the search box is crowding the header logo area altogether.
Thanks for anyone's help in advance!
jj

[Author]

Posts