Display on web site not matching design window

[jen0dorf]

Hi

I have this code on a page to add a background to some text:

<p>Follow the sign to

         <span>XM496</span>

       (Britannia) as indicated.

        </p>

which is controlled by

span {

    color: #FFF;

    background-color: #600;

}

In my design window it shows up perfectly but in a browser it does not.

The web site is

http://www.xm496.com

would appreciate some help on what I’ve missed

thanks

Ian

[BenPleysier]

Nowhere in your online CSS documents do I come across background-color: #600;.

Where did you place it?

[jen0dorf]

Hi

Mmmm perhaps thats the issue? I checked and it is there and it's being called

<link href="p7affinity/p7affinity_05.css" rel="stylesheet" type="text/css" />

it's in

/htdocs/p7affinity/p7affinity_05.css

thanks

Ian

[Jon Fritz]

Change the following...

span {

color: #FFF;

background-color: #600;

}

to

.content p span {

color: #FFF;

background-color: #600;

}

[Nancy OShea]

Using ordinary <span> tags is not efficient or meaningful.  Span carries no semantic weight, it's an inline element.  It's most often used when you need a quick style change mid-sentence.  But it's not a replacement for HTML 5 tags <div> <section> <header> <footer> <nav> <p> <h1> <h2> etc...

An example of when to use the <span> tag:

<p>This is a default paragraph style with a <span class="red">red class</span> inside.</p>

Please review HTML5 semantic tags for more info.

HTML5 Semantic Elements

Nancy