html - Cannot add CSS attributes to <span> -
in css file have following rules:
div.breadcrumbs span { position: relative; left: -120px; height: 16px; line-height: 16px; margin: 0 20px; overflow: hidden; } div.breadcrumbs img { margin: 0 -20px; padding: 5px 5px 0px 5px; } div.breadcrumbs { color: #88263f; font-weight:bold; } the rules img , a work, not span.
also not work like
span { display: none; } at moment have no clue how debug this.
in principal, posted css works.
if html looks this...
<div class="breadcrumbs"> these <span>breadcrumbs</span> in line... </div> and css:
div.breadcrumbs span { position: relative; left: -120px; height: 16px; line-height: 16px; margin: 0 20px; overflow: hidden; } span { display: none; } then span element not shown intended.
see demo at: http://jsfiddle.net/audetwebdesign/qyu5a/
you may have other problems such other css rules conflicting , preventing display: none property working correctly.
there nothing wrong positioning of inline element, may not expect depending on line height , surrounding content.
you may want learn more how css cascade , specificity work.
reference: http://www.w3.org/tr/css2/cascade.html#cascade
note: height property ignored inline elements.
Comments
Post a Comment