Can someone check this code please?

[geotso]

https://exetragoudi.000webhostapp.com/sample.html

I can't figure out why chromium based browsers (Chrome, Opera) wrap the text of the first line, while IE, Edge and Firefox don't...

[BenPleysier]

I'm sorry, I cannot figure out why without spending a lot of time. I do have a solution as follows

1. change

.dscinf p::first-line {

  font-weight: bold;

}

to

.dscinf a:first-child {

  font-weight: bold;

}

2. add the highlighted line

.dscinf a {

  color: #039;

  text-decoration: none;

  display: block;

}

3. move the paragraph element to cover the last two lines only

<div class="dscinf"><a href="#">THIS IS A (INTENTIONALLY EXTENDED) SAMPLE TITLE OF THE LP</a>

  <a href="#">Artist name</a>

  <p>Jun 2000<br>

  Mercury 542558</p>

</div>

[geotso]

Well, I'll try it. Thanks.

Meanwhile, I found out that I can only remove the second left-float style (.dscinf) to fix it.

It seems that Chrome doesn't want two left-floats side by side.

Thanks again.

[Giordano - ACP Italy]

You could assign a different class for each "a" or use the span tag for individual parts of text with different css styles.

Regards

[geotso · Accepted solution]

This is partially right.

The real problem was the ::first-line pseudo-element. I removed it and then applied <strong> to individual <a> tags.

Thanks.