6

Could someone explain to me how to customize Bootstrap's input type="email" validation tooltip like the one below?

tooltip - please enter an email address.

Or better yet, could someone explain how customize Bootstrap's validation tooltips in general?

EDIT:

It has been pointed out by Le_Morri that this is actually a HTML 5 validation tooltip. I am going to leave up the question for other people who make the same mistake as I did.

The following questions will help with HTML5 validation styling,

Community
  • 1
  • 1
James McMahon
  • 48,506
  • 64
  • 207
  • 283
  • 2
    as far as i know they are styled by the browser. [Here](http://webdesign.tutsplus.com/tutorials/site-elements/bring-your-forms-up-to-date-with-css3-and-html5-validation/) you have a guide how do build a workaround. – Le_Morri Apr 20 '13 at 17:40
  • 1
    @Le_Morri, Oh wow, I had no idea that was an HTML5 thing and had assumed Bootstrap was doing it. Could you make your comment into an answer so I can give you some points? – James McMahon Apr 20 '13 at 17:44

1 Answers1

6

as far as i know these validation tooltips are not from bootstrap. They are and HTML5 feature and are provided and styled by the browser.

Here you can find a guide how to create your own validation tooltips.

In Webkit browsers you can style these tooltips a bit using:

::-webkit-validation-bubble-message {
    padding: 1em;
}

and with the CSS :invalid selector you can style the wrong inputs

Le_Morri
  • 1,619
  • 14
  • 18