Brian Miyasaki in reply to:
Changing the Layout of the Search widget

#50279

That worked beautifully! thank you! and I see how you played with the list css which made it work! thanks again!

Add New Note to this Reply

Brian Miyasaki in reply to:
Changing the Layout of the Search widget

#49910

http://imgur.com/FJ4yki4 here is a link of what we are wanting it to look like at the top of the page.

Add New Note to this Reply

Brian Miyasaki in reply to:
Changing the Layout of the Search widget

#49836

Ok, I have installed the plugin CPT UI and created taxonomies for the pages all with the labels of

– Main Floor Square Footage
– Levels
– No. of Bedrooms
– Office/Den
– Width (Feet)
– Depth (Feet)
– Other Features

and reconstructed my search and filter form.
https://css-tricks.com/injecting-line-break/ I’m thinking that this might help but I can’t fingure out how to call out to the specific class that would need this line break, sorry I’m pretty new with css, still getting my head around it.

Add New Note to this Reply

Brian Miyasaki in reply to:
Changing the Layout of the Search widget

#49664

This reply has been marked as private.

Add New Note to this Reply

Brian Miyasaki in reply to:
Changing the Layout of the Search widget

#49571

Thank you I found this thread https://support.searchandfilter.com/forums/topic/sf-horizontal-the-final-solution/ which helped a lot but the problem I am coming across right now is getting the check boxes to line up in 3 columns in a row like in the photo above. here is the css I am using .

.searchandfilter[data-sf-form-id=”116014″] .chosen-container.chosen-container-multi {
width: 100% !important;
margin-top: -5px !important;
}

.searchandfilter[data-sf-form-id=”116014″] input.default {
border-color: rgba(0,0,0,0.3);
outline: 1;
outline: thin dotted \9;
box-shadow: inset 0 1px 1px rgba(0,0,0,0.075),0 0 8px rgba(0,0,0,0.2);
-webkit-transition: border linear 0.2s,box-shadow linear 0.2s;
transition: border linear 0.2s,box-shadow linear 0.2s;
}

.searchandfilter[data-sf-form-id=”116014″] li.sf-field-category {
width: 30% !important;
}

.searchandfilter[data-sf-form-id=”116014″] select.sf-input-select {
width: 100%;
}
`

Add New Note to this Reply

[Author]

Posts