Search code examples
htmlpre

removing spaces in <pre> tag - html

Hi I am using pre tag to dispaly some text files, but the problem is at the beginning and the end, 2-3 new lines are being printed. How do I remove that? I am getting the text file through http request and I cannot modify the text file, I have to display as is.

Or is there a better way to display text files in html?

Solution

  • I faced a similar problem in the past..... I think this could be a problem, can't tell for sure unless you share the code (I faced the problem in my AngularJS app, so the variable binding, etc. in the code below is based on that)

    suppose you have to display the data in the variable textFile.data (I stored the data in textFile.data variable)

    <pre ng-show = "textFile.isPresent">
    <span>
        {{textFile.data}}
    </span>
</pre>

    There are two new-line chars added when the html was displayed because whatever is there between pre tag is exactly shown. So 2 lines were added because of the new line in the html after "pre" tag and after "span" tag.

    I changed it to this

    <pre ng-show = "textFile.isPresent"><span>{{textFile.data}}</span></pre>

    The extra lines were removed after doing this. Note that you can also remove them by modifying the css file. If you don't know how, comment, i'll help you out.

    This is just one of the reasons, have to see your code, to tell what is exactly wrong