Possible Duplicate:
Is there any way to reset :after/:before CSS rules for an element?
Is there a neat way to undo all ::before and ::after pseudo element rules on an element? I want to remove the arrow effect on a dropdown menu which is using Twitter bootstrap styles. Do I have to unset each rule one by one or can it be cleared any other way? E.g
.navbar .nav > li > .dropdown-menu::after {
position: absolute;
top: -6px;
left: 10px;
display: inline-block;
border-right: 6px solid transparent;
border-bottom: 6px solid white;
border-left: 6px solid transparent;
content: '';
}
Definition and UsageThe ::before selector inserts something before the content of each selected element(s). Use the content property to specify the content to insert. Use the ::after selector to insert something after the content.
::before. In CSS, ::before creates a pseudo-element that is the first child of the selected element. It is often used to add cosmetic content to an element with the content property. It is inline by default.
::before. ::before is a generated content element that represents a styleable abstract first child of the respective element. The content inserted using ::before is inserted before other content inside the element and is displayed inline by default. The value of the content is specified using the content property.
CSS ::before and ::after pseudo-elements allow you to insert “content” before and after any non-replaced element (e.g. they work on a <div> but not an <input> ). This effectively allows you to show something on a web page that might not be present in the HTML content.
http://jsfiddle.net/LQTmF/
<selector>:after{
content:none;
}
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