Widget Formatting Help

[acleanplate]

Hey! At the very top of http://www.acleanplate.com/recipes I have a "recipe search" widget with three elements (two drop-down lists and a search button) I want to display side-by-side with equal distance between them. As you can see, they are currently "stepped" with no space at all between them. If it helps, I started with Magazine Pro, but I've changed a lot.

Here is the code I have currently for that area:

#recipe-ingredient.postform,
#recipe-post_tag.postform,
#wpurp_recipe_search_widget-2 input {
	display: inline;
	float: left;
	clear: none;
	margin-bottom: 0;
	padding: 14px 20px;
	width: 30%;
}

I can't quite figure out what's missing.

TIA for any insights!

http://www.acleanplate.com/recipes/

[msummers]

Right now, your code looks like this -

</select>
<br/><select name='recipe-post_tag' id='recipe-post_tag' class='postform' >

The same is true for the next <select> tag. Just remove the <br/> and apply a bit of right margin to the select tag...

[acleanplate]

I wrote the page in CSS and don't see that HTML anywhere (or know where to look to edit it, apparently).

Any other ideas?

[msummers]

Can you show us the code in your recipe search widget, please?

[Author]

Posts