CODEWITHSUNDEEP
jquery
user1831677
user1831677

Reputation: 211

Why does <b> tag work here and not the <strong> tag?

I don't understand why the <b> tag works here and the <strong> does not.

Thanks.

html 

<ul id="one">
  <li>one</li> 
  <li>two</li>
</ul>

<ul id="two">
  <li>three</li> 
  <li>four</li>
</ul>

jQuery

$( '#one li' ).each(function( index ) {
$( this ).prepend( "<b>" + index + ": </b>" );
});

$( '#two li' ).each(function( index ) {
$( this ).prepend( "<strong>" + index + ": </strong>" );
});

fiddle: http://jsfiddle.net/cXArG/

Upvotes: 0

Views: 535

Answers (6)

Pieter
Pieter

Reputation: 1833

In Fiddle Options, uncheck 'normalized CSS'. <strong> should be displayed with font-weight: bold as standard (http://dev.w3.org/html5/markup/strong.html)

Upvotes: 0

MrCode
MrCode

Reputation: 64526

It does work, it's just that the Normalize CSS that you're including is setting the strong tags font-weight to normal, so it doesn't appear bold. In the Filter Options, you can uncheck Normalize CSS to remove it.

You could add a color to see the strong tags for example:

strong { color:red; }

Demo

Upvotes: 3

pilsetnieks
pilsetnieks

Reputation: 10420

The <strong> tag works just fine, it is prepended in the code but jsFiddle's CSS styling removes bold weight from the <strong> tag.

Upvotes: 0

cetver
cetver

Reputation: 11829

/*http://fiddle.jshell.net/css/normalize.css (line: 17)*/
address, caption, cite, code, dfn, em, strong, th, var {
    font-style: normal;
    font-weight: normal;
}

Upvotes: 0

Loken Makwana
Loken Makwana

Reputation: 3848

It's not related to or , this is an css scenario

on JSFiddle is shown like regular text using stylesheet

if you inspect the element you will find this css rules applied to 

address, caption, cite, code, dfn, em, strong, th, var {
  font-style:normal;
  font-weight:normal;
}

which makes it like regular text

Upvotes: 0

strauberry
strauberry

Reputation: 4199

The <b> tag is for influencing the markup (bold font), whereby the <strong> tag is to describe a logical/semantical aspect of the text ("It defines important text"). How this semantics is formatted is not the business of this tag.

Upvotes: 1

Related Questions