CODEWITHSUNDEEP
css
selectcase.biz
selectcase.biz

Reputation: 69

which CSS selector after a br-tag

how is the selector for the "item b" in this sample:

<td class="col_3">item before br-tag <br/> flexible item after br-tag</td>

This is not working:

td.col_3  > br 
{display: none;}

Upvotes: 6

Views: 7178

Answers (2)

Pixelgeometry Design Studio
Pixelgeometry Design Studio

Reputation: 91

Try using the following CSS selectors:

.col_3 { 
   color:red;
 } 
.col_3:first-line { 
   color:gray;
 }

Upvotes: 9

jayms
jayms

Reputation: 4018

I am sorry to tell you that there is no selector for text-nodes. Only elements can be targeted with CSS. If you wish to style two text-nodes differently they need to be nested in two different elements.

Is there a problem with nesting your lines in spans?

<span>line 1</span><br>
<span>line 2</span>

You could then target line 2 with br + span {} or alternatively span:last-child {}

Edit: Now that I know you want a gray background, what you can do is place a semi-transparent area over it, like this (You may have to adjust the height):

.col_3 {
  position:relative;
  background:white;
}
.col_3::before {
  content:' ';
  position:absolute;
  background:black;
  opacity:.5;
  bottom:0;
  left:0;
  width:100%;
  height:50%;
}
<table>
<tr>
  <td class="col_3">Line 1<br>Line 2</td>
</tr>
</table>

Upvotes: 0

Related Questions