CSS Can't change input text background colour in chrome & bootstrap [closed] - css

Question

Closed. This question is not reproducible or was caused by typos. It is not currently accepting answers.
This question was caused by a typo or a problem that can no longer be reproduced. While similar questions may be on-topic here, this one was resolved in a way less likely to help future readers.
Closed 2 years ago.
Improve this question
I am trying to change the background-color of my input text and its not changing in chrome, it works in Safari but not chrome:
input {
background-color: red !important;
}
<form action="login.php?action=login" method="post">
<div class="row">
<div class="col-md-12">
<div class="form-group">
<input type="text" name="username" id="username" class="form-control" />
</div>
<div class="form-group">
<input type="password" name="password" id="password" class="form-control" />
</div>
<div class="form-group">
<input type="submit" name="submot" id="submit" class="btn btn-default" value="Login" />
</div>
</div>
</div>
</form>

Answer 1

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
-webkit-box-shadow: 0 0 0 30px white inset !important;
}
and this to change color in autofill textbox:
input:-webkit-autofill {
-webkit-text-fill-color: yellow !important;
}

Answer 2

You can use jquery for this. Try this. This works and supports perfectly in all browsers.
$(document).ready(function(){
$(".test");});
Try the following example:
$(document).ready(function(){
//Method 01
$(".test");
//Method 02
//$(".test").css("background-color", "red");
});
.test{
background-color:#64b5f6; /* Your color */
color:#000;
border:none;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="text" name="username" id="username" class="form-control test" />
Happy coding!