Displaying Search & filter fields: change list style to line break

Anonymous

#191303

where can I change the style to show fields of a search form from list style into simple line breaks between the fields.

Example see here:
http://www.andrew-phelps.com/4-sided/

Trevor

#191313

I am sorry, I do not understand what you need. Are you able to describe in more detail or maybe make an annotated screenshot (upload that to a file sharing site and share the link with me)?

Anonymous

#191317

The problem is, that the plugin lists the search fields as list

• https://www.dropbox.com/s/wuywtug1fextu7k/li-style.png?dl=0

  but I want them just in plain rows e.g. divided with an simple <br/>
  look like the responsive view
  https://www.dropbox.com/s/d52gac4337tpqfi/rows.png?dl=0

  where can I find the template to change that?

Trevor

#191319

They would normally be vertical but in your child theme CSS, on line 566, you have made them display: inline-block, which makes them horizontal.

.searchandfilter > ul > li {
    display: inline-block;
    vertical-align: top;
    padding: 0 12px;
    border: none;
    background-color: none;
}

It is not possible to change them from a list to just line breaks, but the cause is this CSS you have added. Do you need them to look differently from Desktop to Mobile? In which case, wrap the CSS in a media query so it affects on desktop screen widths.

Anonymous

#191339

Thank you.
Sorry…that was my fault.

[Author]

Posts