Padding around Search Widget in Upper Right Widget Area

[jeepkid99]

Hello,

I'm using Education Pro and have placed a menu as well as a search widget in the header upper right widget area. I cannot for the life of me figure out how to reduce the size of the padding around the search widget, specifically below. The client wants it very tight with the menu. Any suggestions?

Site can be seen here.

Another option I'd love would be how to add a search function to the RIGHT of the current menu, similar to what happens when you select a primary navigation extra from the Theme Settings.

Thank you!

http://insuranceredmond.com

[Pixel Frau]

It's coming from the bottom margin here:

.widget {
    margin-bottom: 40px;
    overflow: hidden;
    word-wrap: break-word;
}

You can use floats to position the search widget next to the menu.

[jeepkid99]

You rock! I spent 2 hours looking for that little bit of code... Thank you, Julia! If you have time, can you explain to me what a "float" is?

[Pixel Frau]

Glad that sorted it for you. This should help explain using float in CSS.

[jeepkid99]

One more quick one since I've got you on the line:)

If you look back at the header right widget area, you will see a large gap at the bottom again below the phone number. What controls this gap and how would I tighten it up like we did in Search?

Promise, that was my last question! You're very helpful!

-Taber

[Pixel Frau]

It looks like a combination of things. There's a bottom margin on the widget itself, plus bottom margins on the h3 and buttons within the widget.

You might want to check out Firebug, which helps you pinpoint CSS to make changes. There's a short video on the site that shows you how to use it.

[Author]

Posts