How to add title='mandatory' from css to the following
<label class='mandatory'>Name</label> .mandatory { background-image:url(/media/img/required.gif); background-position:top right; background-repeat:no-repeat; padding-right:10px; font-weight:bold; }
Using Title CSS, you'd do the following: For any global CSS class, use a capitalized name (title case). For any modifier or descendant class, use a lowercase letter for the beginning of th name. This means with Title CSS you capitalize any class name that will get referenced in the stylesheet without a parent class.
You can apply CSS to the <title> element, but not though the style attribute (since it is for "All elements but BASE, BASEFONT, HEAD, HTML, META, PARAM, SCRIPT, STYLE, TITLE").
You can't style an actual title attribute It's not possible for a webpage to apply any style to the tooltip that the browser displays based on the title attribute. However, you can create something very similar using other attributes.
Well, although it's not actually possible to change the title attribute, it is possible to show a tooltip completely from CSS. You can check a working version out at http://jsfiddle.net/HzH3Z/5/.
What you can do is style the label:after selector and give it display:none, and set its content from CSS. You can then change the display attribute to display:block on label:hover:after, and it will show. Like this:
label::after { content: "my tooltip"; padding: 2px; display: none; position: relative; top: -20px; right: -30px; width: 150px; text-align: center; background-color: #fef4c5; border: 1px solid #d4b943; -moz-border-radius: 2px; -webkit-border-radius: 2px; -ms-border-radius: 2px; border-radius: 2px; } label:hover::after { display: block; }
You can't. CSS is a presentation language. It isn't designed to add content (except for the very trivial with :before
and :after
).
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With