CODEWITHSUNDEEP
htmlcsspseudo-element
Koiten
Koiten

Reputation: 15

Why ::first-line doesn't work with pre-wrap?

HTML

  <div class="">
    Blahblah blah blah

    asndlansdlansdlajdbnalsnd        laksndlaknsdlak
    lksdnalksdnlaknsdl         akbsjdakjsbdakjsdlajsndl
     akjsbaksjdalsdn asldknalsndla asdlk nalsdnalsknd
  </div>

CSS

div::first-line {font-weight: bolder; color: blue;}
div {white-space: pre-wrap;}

It applies only pre-wrap. T_T

My idea was to highlight every first line in every div but I'm using pre-wrap for divs to type more convenient. Thanks for help. )

Upvotes: 0

Views: 260

Answers (1)

BoltClock
BoltClock

Reputation: 723729

You have a line break immediately following your <div class=""> start tag. So the first line in your div is empty, and that's why none of the text appears blue.

I don't know what you mean by "using pre-wrap for divs to type more convenient" and it's impossible to deduce your use case from the gibberish in your example, but regardless of whatever you are trying to accomplish, you can see that ::first-line does work even in white-space: pre-wrap when you remove the initial line break:

div::first-line {font-weight: bolder; color: blue;}
div {white-space: pre-wrap;}
<div class="">Blahblah blah blah

  asndlansdlansdlajdbnalsnd        laksndlaknsdlak
  lksdnalksdnlaknsdl         akbsjdakjsbdakjsdlajsndl
   akjsbaksjdalsdn asldknalsndla asdlk nalsdnalsknd
</div>

Upvotes: 1

Related Questions