How about increasing the width values and perhaps adding media queries for different browsers?
First, try setting the fieldset width to 100%:
.searchsettings fieldset {
width: 100% !important;
}then the options to a min-width of 200px and a width of 45%:
.asp_option_cat {
min-width: 200px;
display: inline-block;
width: 45%;
}
Try different values as well, but this way the width is going to be 45% on bigger screens, and minimum of 200 if it goes down. And if the screen is too small it automatically breaks the line to 1 column.
The space on C2.jpg is because of the line alignment. Since the first element label is broken to two lines because of the 200px width, it icreases the line height, and the second one is printed to the line bottom by default. You can try increasing the line height or the vertical alignment, but as I can see there are more animated elements on the page, including the scrolling, and different vertical alignments may cause blurring in the text (browser bug). There is a good chance you will have to live with it, I don’t see other solution in inline-block mode.
Best,Ernest Marcinko
If you like my products, don't forget to rate them on codecanyon :)
