By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
443,846 Members | 1,836 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 443,846 IT Pros & Developers. It's quick & easy.

CSS pseudo-element first-line no work

P: n/a
Hi,

I am having trouble with CSS in that I can't
get the pseudo-element 'first-line' to work.

I have some pages that contain dialog. I use
a <dlfor this, with the character's name in
a <dtfollowed by the words in a <dd>. This
is rendered as I wish with the first line not
indented, the following lines indented, and no
leading (whitespace) between the two.

However, it is bad practice to use HTML tags
for layout; layout should be in the style
sheet. So I thought I would use the CSS
pseudo-element 'first-line' to mimic the <dl>
layout. Here is a test page:

http://members.tripod.com/martin_leese/Marvin/test.html

I have viewed this using Firefox 1.5,
Netscape 7.02, and IE 5.50. Only Netscape
appears to work, and only for
class="dialogmargin".

Can somebody please explain what I am doing
wrong here.

--
Many thanks,
Martin Leese
E-mail: pl****@see.Web.for.e-mail.INVALID
Web: http://members.tripod.com/martin_leese/
Jan 6 '08 #1
Share this Question
Share on Google+
2 Replies


P: n/a
Jonathan N. Little wrote:
Martin Leese wrote:
>Hi,

I am having trouble with CSS in that I can't
get the pseudo-element 'first-line' to work.
....
>I have viewed this using Firefox 1.5,
Netscape 7.02, and IE 5.50. Only Netscape
appears to work, and only for
class="dialogmargin".

Can somebody please explain what I am doing
wrong here.

Well firstly, no way, no how IE 5.50 will work because it does not
support :first-line pseudo element, (as well as many other CSS
properties). AS I recall FF1.5 supported it but all these browsers are
*old*, Firefox is at 2.0.0.11 with 3 soon to be release and Netscape is
officially dead and buried!
Some people consider support of older
browsers to be a good thing.
Anyway there is an easier way, 2 classes.
This way it will work in these ancient browsers
....
div.orator { margin: 0 1em; }
div.dialog { margin: 0 1em 1em 3em; }
This looks good; many thanks. I finally
settled on:
p.char {margin-bottom: 0}
p.dialog {margin-top: 0; margin-left: 40px}
Follow up to: comp.infosystems.www.authoring.html
I don't have any NG listing: alt.html.css
I do, so I have put it back :-)

--
Thanks again,
Martin Leese
E-mail: pl****@see.Web.for.e-mail.INVALID
Web: http://members.tripod.com/martin_leese/
Jan 10 '08 #2

P: n/a
Martin Leese wrote:
Jonathan N. Little wrote:
>>
Well firstly, no way, no how IE 5.50 will work because it does not
support :first-line pseudo element, (as well as many other CSS
properties). AS I recall FF1.5 supported it but all these browsers are
*old*, Firefox is at 2.0.0.11 with 3 soon to be release and Netscape is
officially dead and buried!

Some people consider support of older
browsers to be a good thing.
1. support != look the same

2. The number of IE 5.x users has dwindled to tiny numbers, less than 1%
at sites I monitor. It's not worth the effort to try and coerce its
deficient CSS to give comparable results as more modern browsers. If it
degrades gracefully and the result is usable, good enough. The same
should hold true for any other browser, too.

3. Firefox versions prior to 2.0 are in much the same boat as IE 5.x,
especially since Fx automatically updates itself now. Graceful
degradation and usability are the keys. If you don't have them, you may
have bigger problems with the design as a whole.
>I don't have any NG listing: alt.html.css

I do, so I have put it back :-)
Never heard of alt.html.css myself. Consider the sister group to
ciwa.html: comp.info.www.authoring.stylesheets

--
Berg
Jan 10 '08 #3

This discussion thread is closed

Replies have been disabled for this discussion.