CSS Wordpress Help


I am trying to tidy up our job board, and have messed up the drop-down filters, Instead of showing in 3 columns, they are all over the place, plus one of the dropdowns looks different to the other.

I changed themes and thought i could do it, but not working.  Could somebody have a look at this please, so that i can get the filters inline, in 3 columns (Location, Position type, Fleet Type)

MY website ---need to fix thisjob filters
Jon ImmsWeb DeveloperAsked:
Who is Participating?
Juana VillaFront-end DeveloperCommented:
I apologize I forgot to add this code. Please use this code plus the previous code I added :D

   /*there is already a selector with these styles. Background color was removed and padding and height was adjusted.*/
.chosen-container-single .chosen-single {
    position: relative;
    display: block;
    overflow: hidden;
    padding: 6px 8px 6px;
    height: 33px;

Open in new window

Peter HartCommented:
have you fixed this?
it displays in 3 columns on IE and Chrome
maybe it was a browser cache thing using an old style sheet when you checked?
Juana VillaFront-end DeveloperCommented:
Hi Jon,

In order to make the middle one look like the other ones:
.job_filters .search_jobs div.filter_wide, 
.job_filters .search_jobs div.search_categories {
    padding-top: 0; /*double check that the first selector doesn't need the padding top*/
.chosen-container-active.chosen-with-drop .chosen-single {
	border-radius: 0;

.chosen-container-single .chosen-single div {
    padding-top: 5px;

Open in new window

Jon ImmsWeb DeveloperAuthor Commented:
Hi Juana,  

Thank you for the reply and solution.  I did try using the code you suggested, but it did not change the middle drop-down ?
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.