Sent by Keith Underdown on 2 July 2002 14:02
Following the post earlier today I've been playing about with first-letter
and I have some observations and some questions.
Observation 1
Using background-color is a bust as IE only puts it in the space actually
occupied by the letter whereas the other browsers put some above and below
(at half lineheight I assume). This means that one could, for example,
reverse color and background color for the first-letter and it looks fine
except for IE where a T for example just appears as a vertical bar with two
contrasting stripes.
Observation 2
I like the idea of shadow effects but not even the latest versions of
browsers support it.
Question 1
How can I combine these two rules in one?
div#content p:first-letter {
font-size: 150%;
color: #ff8888;
background-color: inherit;
}
div#indexcontent p:first-letter {
font-size: 150%;
color: #ff8888;
background-color: inherit;
}
I tried div#content, indexcontent by analogy with h1,h2,... and that
(according to SelectOracle) would appear to be that.
However, div#content, indexcontent p:first-letter gives
Selects any div element with an id attribute that equals content
or
the first letter of a p element that is a descendant of an indexcontent
element.
Question 2
How can I turn the effect off for certain classes of <p> in such a div?
p.signature p:first-letter
{ background-color:#fefef0;
font-size:100%;
color: teal;
}
Seems not to do anything.
Keith
____________________________________
Keith Underdown
St Thomas Dudley Webmaster
Publicity Officer Spire Appeal Committee
www.cofe-st-thomas-dudley.org.uk
