CODEWITHSUNDEEP
csstwitter-bootstrap
Elad Benda
Elad Benda

Reputation: 36682

couldn't use error style of twitter bootsrap

I want to use the "input with error" styling as appear here: http://twitter.github.com/bootstrap/

and after it a custom css only

(relevant row is 722

form .clearfix.error > label, form .clearfix.error .help-block, form .clearfix.error .help-inline {
  color: #b94a48;
}

)

My markup:

<div id="new_folder_name_div" class="clearfix error">
                    <label for="new_folder_name">Name&nbsp</label>
                    <div class="input">
                        <input class="medium error" id="folder_name" size="15" type="text" />
                        <span>*</span>
                    </div>

An image:

enter image description here

but I see with Chrome console the input element isn't matched with the above css role.

Any idea why ?

Upvotes: 1

Views: 2099

Answers (2)

Gagan Deep
Gagan Deep

Reputation: 489

Try using

$('#folder_name').closest('.clearfix error').addClass('error');

Upvotes: 0

spike
spike

Reputation: 10014

The actual input is the next line down. Note that the containing div with classes "clearfix error" is required.

form .clearfix.error input, form .clearfix.error textarea {
    color: #B94A48;
    border-color: #EE5F5B;
}

<div class="clearfix error">
    <div class="input">
      <input class="xlarge error" type="text">
    </div>
</div>

Upvotes: 2

Related Questions