Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How can I ignore leading and trailing linebreaks within an html "code" block using css, javascript or jquery?

In my HTML source code, I have a code block like the following (I use showdown and highlight.js on this page):

<pre><code class="cpp">
double myNumber = (double)4;
</code></pre>

My problem is that the first linebreak remains part of the "code" block. It's probably because of the enclosing "pre" block, but I need that there because highlight.js expects it (also apparently the HTML5 standard recommends it). The code is rendered like this (note the leading line break):

enter image description here

So my question is, using css, javascript or jquery, how can I remove leading or trailing linebreaks from "code" blocks like this one?

like image 425
Boinst Avatar asked Feb 18 '13 23:02

Boinst


People also ask

How do you preserve spaces and line breaks in HTML?

The <pre> tag defines preformatted text. Text in a <pre> element is displayed in a fixed-width font, and the text preserves both spaces and line breaks.

How do I make text not break a line in HTML?

<nobr>: The Non-Breaking Text element Be aware that this feature may cease to work at any time. The <nobr> HTML element prevents the text it contains from automatically wrapping across multiple lines, potentially resulting in the user having to scroll horizontally to see the entire width of the text.

How do I override BR tag in CSS?

To do this we'll use CSS to change the content of the br tag which will prevent it from making a line break. Then we'll also add content using the :after pseudo-element. That will ensure the <br> tag is replaced with a space.

How do you break a line through a string in HTML?

<br>: The Line Break element. The <br> HTML element produces a line break in text (carriage-return). It is useful for writing a poem or an address, where the division of lines is significant.


1 Answers

You could use this hack:

pre:first-line {
    line-height: 0;
}
like image 161
jonasnas Avatar answered Sep 19 '22 03:09

jonasnas