CODEWITHSUNDEEP
csstwitter-bootstrap-3
Crazy Frog
Crazy Frog

Reputation: 525

Applying custom css to Bootstrap input type text

I spent an hour trying to apply my css to Bootstrap input of type text inside a form. Here's my code:

<form>
  <div class="form-group">
    <input type="text" name="username" value="" id="username" class="form-control" />
  </div>
</form>

input [type=text] {
  background-color: red !important;
}

The strange thing is that if I remove the [type=text] part, then all is ok.

JSFiddle

Upvotes: 0

Views: 3441

Answers (3)

Joempossible
Joempossible

Reputation: 131

hi try this one hope i can help you:

    <div class="form-group">
        <label for="usr">Name:</label>
        <input type="text" class="form-control" id="usr">
        <input type="text" name="username" placeholder="input username">
    </div>
    <div class="form-group">
        <label for="pwd">Password:</label>
        <input type="password" class="form-control" id="pwd">
        <input type="text" name="password" placeholder="input password">
    </div>
</form>

Upvotes: 0

Sebastian Brosch
Sebastian Brosch

Reputation: 43574

You have to remove the space between input and [type=text]:

input[type=text] {
  background-color: red !important;
}
<input type="text"/>
<input type="password"/>

Upvotes: 2

Hiren Jungi
Hiren Jungi

Reputation: 854

Your background spelling is wrong and remove space.

input [type=text] {
  barckground-color: red !important;
}

so make sure you type correct.

input[type=text] {
  background-color: red !important;
}

Upvotes: 0

Related Questions