Changes between Version 12 and Version 13 of Styling Form Controls


Ignore:
Timestamp:
Jun 30, 2011 9:59:52 PM (13 years ago)
Author:
tkent@chromium.org
Comment:

Add another example of validation bubble styling

Legend:

Unmodified
Added
Removed
Modified

  • Styling Form Controls

    v12 v13  
    144144}}}
    145145
     146Another example:
     147{{{
     148::-webkit-validation-bubble-message {
     149    color: #eee;
     150    background: #000;
     151    border-color: #444;
     152    -webkit-box-shadow: 4px 4px 4px rgba(100,100,100,0.5);
     153}
     154
     155::-webkit-validation-bubble-message:before {
     156  content: "";
     157  display: inline-block;
     158  width: 16px;
     159  height: 16px;
     160  margin-right: 4px;
     161  background: url(http://trac.webkit.org/export/90202/trunk/Source/WebCore/inspector/front-end/Images/errorMediumIcon.png)
     162}
     163
     164::-webkit-validation-bubble-arrow {
     165    background: #000;
     166    border-color: #444;
     167    -webkit-box-shadow: 0 0 0 0;
     168}
     169}}}
     170This shows the following bubble:
     171[[Image(validation-bubble-styled.png)]]
     172
     173
    146174The default appearance is defined around http://trac.webkit.org/browser/trunk/Source/WebCore/css/html.css?rev=82180#L588 .