Select wrapped lines with CSS

Is it possible with CSS (3) to visually / text select lines that are automatically inserted by browsers? Something like the end of each wrapped line.

With source code, it is important to see where the lines were wrapped, since new lines can be significant. Giving the user horizontal scrolling is not a good idea ...

+5
source share
2 answers

As far as I know, this is the only way to do this using pure CSS using a :first-linepseudo element

Concept
Add a "visual pointer" to each element, by default.
Select each :first-lineitem to reset styles.

: http://jsfiddle.net/djpTw/

<code>
<div class="line">Too much code at one line. Learn to write shorter lines!</div>
<div class="line">Lonely line.</div>
...
</code>

CSS:

code {display: block; width: 150px;} /* <-- Not interesting, just for testing*/
code .line            {  color: red;  /* Visual indication */ }
code .line:first-line {  color: #000; /* Default color   */ }

( , " " ):

+3

, CSS. , , , , , , , , .

0

All Articles