Search in sidebar: why is label below checkbox?

Anonymous

#26274

I’m just starting but under pressure to deliver. Can you help please?
What can make label to align with checkbox?
The sidebar is wide enough. What setting regulates this alignment?
sample code from page source:
<li class=”sf-item-859″><input type=’checkbox’ name=’_sft_leadership[]’ value=’advocacy’ class=’sf-input-checkbox’ id=’sf_sft_leadership_advocacy’ /><label for=’sf_sft_leadership_advocacy’>Advocacy</label>

test page link leadernetnina.wpengine.com/resource/managing-human-resources/

Ross Moderator

#26329

I looked at your site and looks good – is this issue now fixed?

If you want to style labels differently you could try something like:

.searchandfilter li label
{
    display:inline-block;
    margin-top:-5px;
}

But you will have to try the CSS yourself as some themes put in their own styles.

Thanks

Anonymous

#26338

Thank you Ross! I added the inline-block into my theme custom.last night after posting to you and check-boxes are good in Chrome but not in my FF.

What about putting two of the buttons next to each other: Search and Clear Fields. Do you have a solution?

Thank you again, Nina

Ross Moderator

#26616

Hey Nina

The CSS really depends on your theme, and what styles it applies to the various elements – the above is a rough guide only – same applies here.

To target the list items for hte submit and reset, and position them next to eachother I would try something like:

.searchandfilter .sf-field-search, .searchandfilter .sf-field-reset
{
    display:inline-block;
}

Thanks

[Author]

Posts