Question about CSS selectors

[Jeanne D]

This is probably really obvious, but I can't find what I'm looking to
do in my DHTML and CSS manual.

I want to have two different selectors specified on one line of type.

The Great Escape .... by JD

I wanted the The Great Escape to be in one font and ... by JD in
another. How do I do that? Thanks much.

 

[Jeanne D]

Please disregard my question - I need to familiarize myself with
positioning. Guess one has to think differently, I'm still in HTML mode.

 

[Chris Beall]

This is probably really obvious, but I can't find what I'm looking to
do in my DHTML and CSS manual.

I want to have two different selectors specified on one line of type.

The Great Escape .... by JD

I wanted the The Great Escape to be in one font and ... by JD in
another. How do I do that? Thanks much.

Jeanne,

Hmmm. This looks like a citation, so you could use something like:

<cite>The Great Escape <span class="author">.... by JD</span></cite>

Then, in the CSS:

cite {
font-family: whatever1 ;
}
..author {
font-family: whatever2 ;
}

That would apply whatever2 to ANY element of class author. If that's
too general, you could instead say:

cite span.author {
font-family: whatever2 ;
}

Which means "apply this style to any <span> of class author that is the
descendant of (i.e. contained inside) a <cite>".

The exciting details of CSS selectors can be found at
http://www.w3.org/TR/CSS21/selector.html. I recommend ingestion of a
stimulant before reading.

Chris Beall

 

[dorayme]

This is probably really obvious, but I can't find what I'm looking to
do in my DHTML and CSS manual.

I want to have two different selectors specified on one line of type.

The Great Escape .... by JD

I wanted the The Great Escape to be in one font and ... by JD in
another. How do I do that? Thanks much.

How about something like:

<div class="whatever1">The Great Escape <span class="whatever2">by
JD</span></div>


dorayme

 

[Andy Dingley]

I wanted the The Great Escape to be in one font and ... by JD in
another. How do I do that?

<span class="title" >The Great Escape</span> by <span
class="author" >JD<span>


Then in the CSS use

..title {
font-family: sans-serif;
font-size: 110%;
}
..author {
font-family: serif;
font-style: oblique;
}

Obviously you can use any CSS settings in these rules that you might
wish.

And you need a better CSS book (try Lie & Bos)

 

[JDS]

I'm still in HTML mode.

In a general sense, to mentally transition to HTML+CSS instead of, say
HTML plus HTML tables for layout, remember that absolutely no layout clues
go into the HTML. I think the hardest part of *realy* switching from
using HTML tables for layout is not using HTML for layout AT ALL. A
really well structured HTML document that uses CSS for layout should look,
without the CSS applied, like a very plain vanilla HTML page circa 1994.

 

[Jeanne D]

Thanks Chris - worked great. Thanks for the link too - I've visited
that site in the past.

 

[Jeanne D]

from: dorayme
<<How about something like: <div class="whatever1">The Great Escape
<span class="whatever2">by JD</span></div>>>


Thank you - I will try this too.

 

[Jeanne D]

Andy writes:
<And you need a better CSS book (try Lie & Bos) >

Thanks for the information. I picked up the Zen of CSS design at the
library, will try to find Lie & Bos.