CSS rules not work properly

Anonymous

#237753

Hello ,
In this page i’ve your search form that work perfectly but the css rules applied has stopped to work and,how do you see the backgroud to field is not on full section but only in the text.

here the rules that you have created for me last time :

.searchandfilter[data-sf-form-id="5236"] li.sf-field-taxonomy-product_cat > ul > li {
display: inline-block;
margin-right: 10px;
margin-bottom: 10px;
border: 1px solid #000;
border-radius: 4px;
padding: 0;
}
.searchandfilter[data-sf-form-id="5236"] li.sf-field-taxonomy-product_cat .sf-input-checkbox:checked + .sf-label-checkbox {
color: #fff;
background: #960E12
}
.searchandfilter[data-sf-form-id="5236"] li.sf-field-taxonomy-product_cat input.sf-input-checkbox {
display: none;
}

.searchandfilter[data-sf-form-id="5236"] ul li.sf-field-submit {float:left}
.searchandfilter[data-sf-form-id="5236"] ul .sf-field-reset {float:left; margin-left: 20px}

/* Input */
#search-filter-form-5236 .sf-field-submit input{
	border-top-left-radius:25px;
	border-top-right-radius:0px;
	border-bottom-left-radius:25px;
	border-bottom-right-radius:25px;
	background-color:#960e12;
	position:relative;
	top:0px;
	right:auto;
}

/* Search filter reset */
#search-filter-form-5236 ul .search-filter-reset{
	border-top-right-radius:25px;
	border-bottom-left-radius:25px;
	border-bottom-right-radius:25px;
	background-color:#960e12;
}

/* Section */
#main .elementor .elementor-element-207812a{
	background-color:transparent;
}

/* Span Tag */
#search-filter-form-5236 ul span{
	visibility:hidden;
	
}

On that the section INPUT is that related :

/* Input */
#search-filter-form-5236 .sf-field-submit input{
	border-top-left-radius:25px;
	border-top-right-radius:0px;
	border-bottom-left-radius:25px;
	border-bottom-right-radius:25px;
	background-color:#960e12;
	position:relative;
	top:0px;
	right:auto;
}

Can you help me to back to have the section and not only the text backgrounded ?

Thank You

Anonymous

#237754

This reply has been marked as private.

Trevor

#237760

One thing that I think it needs is this:

.searchandfilter[data-sf-form-id="5236"] li.sf-field-taxonomy-product_cat > ul > li label:hover {
  cursor: pointer;
}

So, to your question. This:

.searchandfilter[data-sf-form-id="5236"] li.sf-field-taxonomy-product_cat .sf-input-checkbox:checked + .sf-label-checkbox {
color: #fff;
background: #960E12
}

Needs to be:

.searchandfilter[data-sf-form-id="5236"] li.sf-field-taxonomy-product_cat .sf-input-checkbox:checked + .sf-label-checkbox {
color: #fff;
background: #960E12;
line-height: 26px;
}

Anonymous

#237779

Perfect you have newly solevd the problem .
THANK YOU

Trevor

#237785

Thanks for letting me know. I will close this thread for now.

[Author]

Posts