Getting normal font in italic paragraph

[OfficeAnimal]

I have a paragraph CLASS defined thus:

.quote
{
FONT-FAMILY: Times, serif;
FONT-SIZE: 12pt;
FONT-STYLE: italic;
PADDING-LEFT: 2.5em;
PADDING-RIGHT: 2.5em;
}

If I want to include the reference to that quotation in normal (upright) font, without going outside the 'quote' paragraph, how do I stop the text being italic?

 

[trollacious]

Try using a <span> where you have defined the font style as normal.

Lee

 

[OfficeAnimal]

Thanks, Lee, but I don't kknow what you mean. I looked up <SPAN> in

http://www.december.com/html/4/element/span.html

but that didn't help.

Can I trouble you for an example?
Thanks

 

[BillyRayPreachersSon]

You would put a SPAN element around the 'normal' text, and using CSS, define that SPAN to have whatever text and font characteristics you wish... e.g:

p.quote span {
   /* Whatever styling you want here */
}

...

<p class="quote">Blah waffle drone <span>styled differently</span> yadda yadda yadda</p>

Hope this helps,
Dan



Coedit Limited - Delivering standards compliant, accessible web solutions

Dan's Page [blue]@[/blue] Code Couch:

http://www.codecouch.com/dan/

Code Couch Tech Snippets & Info:

http://www.codecouch.com/

 

[ChrisHunt]

If you have a paragraph which represents a quotation from elsewhere, HTML has an element for that: <blockquote>. You could also use the <cite> element to indicate where the quote came from.

Both have a particular appearance in most browsers - with <blockquote>s indented right andd left, and <cite>s in italics, but you can override that in CSS:

blockquote {
   FONT-FAMILY: Times, serif;
   FONT-SIZE: 12pt;
   FONT-STYLE: italic;
   PADDING-LEFT: 2.5em;
   PADDING-RIGHT: 2.5em;
}

blockquote cite {
   font-style: normal;
}

and your HTML would just look like this:

<blockquote>
   To be or not to be - <cite>Shakespeare</cite>
</blockquote>

Personally, I think it looks better if the citation is on a separate line. You could do that by adding this CSS:

blockquote .cite {
   font-style: normal;
   text-align: right;
   color: #990;
}

and then do your quote like this:

<blockquote>
   <p>To be or not to be</p>
   <p class="cite">Shakespeare</p>
</blockquote>

-- Chris Hunt
Webmaster & Tragedian
Extra Connections Ltd

 

[OfficeAnimal]

Thanks very much folks.
That will surely solve the problem. :-D