Basel theme – Search field placeholder color

Hi Xtemos Team,

I have challenge in the color of place holder, trying to change the color of placeholder but it is not changing !

Can you help me please ?

<div>
					<label class="screen-reader-text">Search for:</label>
					<input type="text" class="search-field" placeholder="Search for products" value="" name="s" id="s" autocomplete="off">
					<input type="hidden" name="post_type" id="post_type" value="product">
										<button type="submit" id="searchsubmit" value="Search">Search</button>
					
				</div>

.whb-column .searchform input[type=text]::placeholder {
	color: red;
}

.searchform input[type=text] {
    color: red;
}

Attachments:

You must be logged in to view attached files.

Hello,

Please add this code to the Theme Settings > Custom CSS > Global:

body .main-header.color-scheme-light .search-extended input[type=text] {
    color: red;
}
body .main-header.color-scheme-light .search-extended input[type=text]::-webkit-input-placeholder { /* Chrome/Opera/Safari */
  color: pink;
}
body .main-header.color-scheme-light .search-extended input[type=text]::-moz-placeholder { /* Firefox 19+ */
  color: pink;
}
body .main-header.color-scheme-light .search-extended input[type=text]:-ms-input-placeholder { /* IE 10+ */
  color: pink;
}
body .main-header.color-scheme-light .search-extended input[type=text]:-moz-placeholder { /* Firefox 18- */
  color: pink;
}

Best Regards

Hi Dear,

I have added the code into the global css, but there is no change in the style, still place holder is white

Attachments:

You must be logged in to view attached files.

Hello,

Please please, provide your site admin access to the private area.

Best Regards

Hi Dear,

please check the site as below credential.

Hello,

Please replace the code with this one:

.mobile-nav .searchform input[type=text]::-webkit-input-placeholder { 
  color: pink;
}
.mobile-nav .searchform input[type=text]::-moz-placeholder { 
  color: pink;
}
.mobile-nav .searchform input[type=text]:-ms-input-placeholder { 
  color: pink;
}
.mobile-nav .searchform input[type=text]:-moz-placeholder { 
  color: pink;
}

Best Regards

Thanks Dear, it is working fine

You are welcome! If you have any questions please feel free to contact us.

Best Regards

[Author]

Posts