I've been struggling to add a solid black border around the text input in my form. However, no matter what I try, the border doesn't seem to style correctly. Here's the code snippet I'm using:
#forminput {
border: solid black !important;
border-top: solid black !important;
border-bottom: solid black !important;
border-width: 0 2px !important;
border-radius: 2px;
}
button {
width: 100px !important;
height: 30px !important;
background-color: #095ba0 !important;
border: 1px !important;
border-color: #095ba0 !important;
color: #fff !important;
font-family: 'Roboto', sans-serif !important;
font-weight: 400 !important;
cursor: pointer !important;
border-radius: 2px !important;
}
<form action="*" method="POST">
<input id="forminput" type="text" name="uid" placeholder="Username" ><br><br>
<input id="forminput" type="password" name="pwd" placeholder="Password" ><br><br>
<button type="submit">Sign In</button>
</form>
Despite using this code, my form inputs still look like they don't have borders as expected. What could be causing this issue?