«

I have a div class "note" which may or may not be more than one line of
text.

<div class="note">
text text dlkhf sdlkfjdsf
sdlkfj sldkjf sdlkjf sldk jf
dlfkjdlkjfldkjflkdjfljkd
</div>

I want the first line of "note" to be indented more than the others, so
tried this in the stylesheet:

div.note:first-line {
padding-left: 30px;
}

But it seems to have no effect. How do I achieve this? The only
examples I've seen operate on simple tags like p:first-line {...} etc.

PS - I also tried div:first-line.note {...} but no effect either.

Thanks for any pointers.

--
Troy Piggins
Ubuntu 5.10 pkgs : kernel 2.6.12-9-386, postfix 2.2.4, procmail 3.22
Compiled from src : slrn 0.9.8.1/rt (score_color patch), mutt 1.5.11i
vim 6.4

Deciding to do something for the good of humanity, Troy Piggins
<usenet-> declared in alt.html:

> div.note:first-line {
> padding-left: 30px;
> }
>
> But it seems to have no effect.

That's because padding doesn't apply to :first-line.

"Only the following properties apply to a :first-line pseudo-element:
font properties, color properties, background properties,
’word-spacing’, ’letter-spacing’, ’text-decoration’, ’vertical-align’,
’text-transform’, ’line-height’, ’text-shadow’, and ’clear’."
http://www.w3.org/TR/CSS21/selector....st-line-pseudo

It does go on to say that UAs may apply other properties as well, but
that will be different in each browser.

--
Mark Parnell

Now implementing http://blinkynet.net/comp/uip5.html

* Mark Parnell wrote:
> Deciding to do something for the good of humanity, Troy Piggins
><usenet-> declared in alt.html:
>
>> div.note:first-line {
>> padding-left: 30px;
>> }
>>
>> But it seems to have no effect.
>
> That's because padding doesn't apply to :first-line.
>
> "Only the following properties apply to a :first-line pseudo-element:
> font properties, color properties, background properties,
> ?word-spacing?, ?letter-spacing?, ?text-decoration?, ?vertical-align?,
> ?text-transform?, ?line-height?, ?text-shadow?, and ?clear?."
> http://www.w3.org/TR/CSS21/selector....st-line-pseudo
>
> It does go on to say that UAs may apply other properties as well, but
> that will be different in each browser.

D'oh - sorry about that. Thanks.

Changed to this and it works:

..note:first-letter {
padding-left: 30px;
}

Interestingly this appears (renders?) the same in Firefox:

div.note:first-letter {
padding-left: 30px;
}

but in IE the first letter seems to inherit .note's padding, margin,
border properties etc.

--
Troy Piggins
Ubuntu 5.10 pkgs : kernel 2.6.12-9-386, postfix 2.2.4, procmail 3.22
Compiled from src : slrn 0.9.8.1/rt (score_color patch), mutt 1.5.11i
vim 6.4

Troy Piggins wrote:
> I want the first line of "note" to be indented more than the others, so
> tried this in the stylesheet:
>
> div.note:first-line {
> padding-left: 30px;
> }

Use text-indent instead:

div.note {
text-indent: 30px;
}

You should probably also indent with em, not px:

div.note {
text-indent: 2em;
}

* Leif K-Brooks wrote:
> Troy Piggins wrote:
>> I want the first line of "note" to be indented more than the others, so
>> tried this in the stylesheet:
>>
>> div.note:first-line {
>> padding-left: 30px;
>> }
>
> Use text-indent instead:
>
> div.note {
> text-indent: 30px;
> }
>
> You should probably also indent with em, not px:
>
> div.note {
> text-indent: 2em;
> }

Yep - that's better. Thanks.

--
Troy Piggins
Ubuntu 5.10 pkgs : kernel 2.6.12-9-386, postfix 2.2.4, procmail 3.22
Compiled from src : slrn 0.9.8.1/rt (score_color patch), mutt 1.5.11i
vim 6.4