How to paste fixed-width long line text without wrapping?

seebee · ‎08-07-2017

I wanted to paste some example diagnostic text into the forum, it is mono-spaced long lines - but there doesn't seem to be a way to do it so it looks neat.

The text is the output of a command, and lines up nicely with multiple spaces when displayed on the console. They are multiple spaces, not tab(s).

When I paste it directly into the forum body box, it is (understandably) variable width font and has the multiple spaces replaced with a single space:

pi@rPi3b:~ $ dnseval.py -f testdns.txt google.co.uk.
server avg(ms) min(ms) max(ms) stddev(ms) lost(%) ttl flags response
----------------------------------------------------------------------------------------------------------------------
213.120.234.42 21.413 13.504 36.701 9.418 %0 216 QR -- -- RD RA -- -- NOERROR
213.120.234.38 16.868 14.032 19.038 1.436 %0 153 QR -- -- RD RA -- -- NOERROR
8.8.8.8 19.870 14.320 26.570 4.552 %0 300 QR -- -- RD RA -- -- NOERROR
212.159.6.10 13.922 13.272 15.461 0.629 %0 238 QR -- -- RD RA -- -- NOERROR
212.159.13.49 13.499 12.617 14.741 0.623 %0 238 QR -- -- RD RA -- -- NOERROR
212.159.6.9 13.558 12.951 14.027 0.420 %0 41 QR -- -- RD RA -- -- NOERROR
212.159.13.50 13.983 13.418 14.929 0.531 %0 237 QR -- -- RD RA -- -- NOERROR

If I change the font family from "arial" to "courier new" that helps but still replaced multiple spaces with a single space:

pi@rPi3b:~ $ dnseval.py -f testdns.txt google.co.uk.
server avg(ms) min(ms) max(ms) stddev(ms) lost(%) ttl flags response
----------------------------------------------------------------------------------------------------------------------
213.120.234.42 21.413 13.504 36.701 9.418 %0 216 QR -- -- RD RA -- -- NOERROR
213.120.234.38 16.868 14.032 19.038 1.436 %0 153 QR -- -- RD RA -- -- NOERROR
8.8.8.8 19.870 14.320 26.570 4.552 %0 300 QR -- -- RD RA -- -- NOERROR
212.159.6.10 13.922 13.272 15.461 0.629 %0 238 QR -- -- RD RA -- -- NOERROR
212.159.13.49 13.499 12.617 14.741 0.623 %0 238 QR -- -- RD RA -- -- NOERROR
212.159.6.9 13.558 12.951 14.027 0.420 %0 41 QR -- -- RD RA -- -- NOERROR
212.159.13.50 13.983 13.418 14.929 0.531 %0 237 QR -- -- RD RA -- -- NOERROR

If I try the "preformatted" dropdown, that picks a fix-width font, but still strips extra spaces.


pi@rPi3b:~ $ dnseval.py -f testdns.txt google.co.uk.
server avg(ms) min(ms) max(ms) stddev(ms) lost(%) ttl flags response
----------------------------------------------------------------------------------------------------------------------
213.120.234.42 21.413 13.504 36.701 9.418 %0 216 QR -- -- RD RA -- -- NOERROR
213.120.234.38 16.868 14.032 19.038 1.436 %0 153 QR -- -- RD RA -- -- NOERROR
8.8.8.8 19.870 14.320 26.570 4.552 %0 300 QR -- -- RD RA -- -- NOERROR
212.159.6.10 13.922 13.272 15.461 0.629 %0 238 QR -- -- RD RA -- -- NOERROR
212.159.13.49 13.499 12.617 14.741 0.623 %0 238 QR -- -- RD RA -- -- NOERROR
212.159.6.9 13.558 12.951 14.027 0.420 %0 41 QR -- -- RD RA -- -- NOERROR
212.159.13.50 13.983 13.418 14.929 0.531 %0 237 QR -- -- RD RA -- -- NOERROR

I tried the "insert code sample" and say "Python" (there isnt a "text" option) - it looks promising as its display mono-spaced and preserves spaces, but it still wraps the lines:

pi@rPi3b:~ $ dnseval.py -f testdns.txt google.co.uk.
server             avg(ms)     min(ms)     max(ms)     stddev(ms)  lost(%)  ttl        flags                  response
----------------------------------------------------------------------------------------------------------------------
213.120.234.42     21.413      13.504      36.701      9.418       %0       216        QR -- -- RD RA -- --   NOERROR
213.120.234.38     16.868      14.032      19.038      1.436       %0       153        QR -- -- RD RA -- --   NOERROR
8.8.8.8            19.870      14.320      26.570      4.552       %0       300        QR -- -- RD RA -- --   NOERROR
212.159.6.10       13.922      13.272      15.461      0.629       %0       238        QR -- -- RD RA -- --   NOERROR
212.159.13.49      13.499      12.617      14.741      0.623       %0       238        QR -- -- RD RA -- --   NOERROR
212.159.6.9        13.558      12.951      14.027      0.420       %0       41         QR -- -- RD RA -- --   NOERROR
212.159.13.50      13.983      13.418      14.929      0.531       %0       237        QR -- -- RD RA -- --   NOERROR

The wrapping isn't too bad in this case on a desktop, but is bad on a mobile browser.

Am I missing a way to paste long lines without wrapping them? i.e. so ideally the individual text box gets its own horizonal scroll bar?

I did wonder about resorting to pasting a picture of the text, but that's not great for screen readers or even just quoting and referencing parts of the output later.dnseval

Thanks.

Gandalf · ‎21-04-2017

The only way I can think of is by copy and pasting the content as a table into the post, for example. It’d be a faff though as your diagnostic text isn’t natively in a table.

From 31st October 2022, I no longer have a regular presence here as I’ve moved on to a new role.

Anoush Mortazavi
Plusnet

Townman · ‎22-08-2007

Attempting a solution...

Create a post with the "surrounding" content and a "place holder"

[PLACE HOLDER]

Then switch to HTML (small fiddly box)!!

Find the [PLACE HOLDER]

Wrap it with <pre style="width: 115%;">[PLACE HOLDER]</pre>

The width value being the least highest above 100% which stops the wrapping.

Replace [PACE HOLDER] with your raw text.

Save it ... see this...

pi@rPi3b:~ $ dnseval.py -f testdns.txt google.co.uk.
server             avg(ms)     min(ms)     max(ms)     stddev(ms)  lost(%)  ttl        flags                  response
----------------------------------------------------------------------------------------------------------------------
213.120.234.42     21.413      13.504      36.701      9.418       %0       216        QR -- -- RD RA -- --   NOERROR
213.120.234.38     16.868      14.032      19.038      1.436       %0       153        QR -- -- RD RA -- --   NOERROR
8.8.8.8            19.870      14.320      26.570      4.552       %0       300        QR -- -- RD RA -- --   NOERROR
212.159.6.10       13.922      13.272      15.461      0.629       %0       238        QR -- -- RD RA -- --   NOERROR
212.159.13.49      13.499      12.617      14.741      0.623       %0       238        QR -- -- RD RA -- --   NOERROR
212.159.6.9        13.558      12.951      14.027      0.420       %0       41         QR -- -- RD RA -- --   NOERROR
212.159.13.50      13.983      13.418      14.929      0.531       %0       237        QR -- -- RD RA -- --   NOERROR

Then post it without any further changes!

Shift the post left/right with the scroll bar below the signature block.

NB: pasting the content and AFTERWARDS fiddling with the HTML does not work, because by then the multi-spaced text has already been mono-spaced!

In another browser tab, login into the Plusnet user portal BEFORE clicking the fault & ticket links

Superusers are not staff, but they do have a direct line of communication into the business in order to raise issues, concerns and feedback from the community.

If this post helped, please click the Thumbs Up and if it fixed your issue, please click the This fixed my problem green button below.

seebee · ‎08-07-2017

Brilliant, I was just looking at the HTML option and Googling for PRE and STYLE options, but I don't know enough about HTML

pi@rPi3b:~ $ dnseval.py -f testdns.txt google.co.uk.
server             avg(ms)     min(ms)     max(ms)     stddev(ms)  lost(%)  ttl        flags                  response
----------------------------------------------------------------------------------------------------------------------
213.120.234.42     13.749      13.388      14.660      0.443       %0       270        QR -- -- RD RA -- --   NOERROR
213.120.234.38     13.901      13.231      14.570      0.355       %0       235        QR -- -- RD RA -- --   NOERROR
8.8.8.8            19.227      14.664      24.878      4.504       %0       300        QR -- -- RD RA -- --   NOERROR
212.159.6.10       13.437      13.150      13.980      0.224       %0       135        QR -- -- RD RA -- --   NOERROR
212.159.13.49      13.684      13.080      15.101      0.618       %0       98         QR -- -- RD RA -- --   NOERROR
212.159.6.9        13.093      12.502      13.451      0.328       %0       96         QR -- -- RD RA -- --   NOERROR
212.159.13.50      13.898      12.934      14.445      0.438       %0       69         QR -- -- RD RA -- --   NOERROR

Thanks!

Townman · ‎22-08-2007

MK2 - a bit less fiddly!

Use the in-built </> (code) tool - select the default HTML.

Paste in your text and press OK.

Go the the HTML editor.

Find

<li-code lang="markup">....</li-code>

Change to

Click OK

...job done!

pi@rPi3b:~ $ dnseval.py -f testdns.txt google.co.uk.
server             avg(ms)     min(ms)     max(ms)     stddev(ms)  lost(%)  ttl        flags                  response
----------------------------------------------------------------------------------------------------------------------
213.120.234.42     21.413      13.504      36.701      9.418       %0       216        QR -- -- RD RA -- --   NOERROR
213.120.234.38     16.868      14.032      19.038      1.436       %0       153        QR -- -- RD RA -- --   NOERROR
8.8.8.8            19.870      14.320      26.570      4.552       %0       300        QR -- -- RD RA -- --   NOERROR
212.159.6.10       13.922      13.272      15.461      0.629       %0       238        QR -- -- RD RA -- --   NOERROR
212.159.13.49      13.499      12.617      14.741      0.623       %0       238        QR -- -- RD RA -- --   NOERROR
212.159.6.9        13.558      12.951      14.027      0.420       %0       41         QR -- -- RD RA -- --   NOERROR
212.159.13.50      13.983      13.418      14.929      0.531       %0       237        QR -- -- RD RA -- --   NOERROR

EDIT: Error corrected as noted below!

In another browser tab, login into the Plusnet user portal BEFORE clicking the fault & ticket links

Superusers are not staff, but they do have a direct line of communication into the business in order to raise issues, concerns and feedback from the community.

If this post helped, please click the Thumbs Up and if it fixed your issue, please click the This fixed my problem green button below.

seebee · ‎08-07-2017

pi@rPi3b:~ $ dnseval.py -f testdns.txt google.co.uk.
server             avg(ms)     min(ms)     max(ms)     stddev(ms)  lost(%)  ttl        flags                  response
----------------------------------------------------------------------------------------------------------------------
213.120.234.42     13.749      13.388      14.660      0.443       %0       270        QR -- -- RD RA -- --   NOERROR
213.120.234.38     13.901      13.231      14.570      0.355       %0       235        QR -- -- RD RA -- --   NOERROR
8.8.8.8            19.227      14.664      24.878      4.504       %0       300        QR -- -- RD RA -- --   NOERROR
212.159.6.10       13.437      13.150      13.980      0.224       %0       135        QR -- -- RD RA -- --   NOERROR
212.159.13.49      13.684      13.080      15.101      0.618       %0       98         QR -- -- RD RA -- --   NOERROR
212.159.6.9        13.093      12.502      13.451      0.328       %0       96         QR -- -- RD RA -- --   NOERROR
212.159.13.50      13.898      12.934      14.445      0.438       %0       69         QR -- -- RD RA -- --   NOERROR

@Townman Thank you very much, that works too!

(I assume you meant <pre style="width: 115%;"> again, rather than <pre style="115%"> as that didn't appear to work for me?

seebee · ‎08-07-2017

@Townman Thanks for the pointers. This "width percentage" works for my desktop, but still looks rubbish in my mobile browser...

A bit of Googling can be a dangerous thing - I'm wondering if using

at the start, rather than specifying a width will be better... I'm hoping it works for mobile browsers. It seems okay in the preview.

pi@rPi3b:~ $ dnseval.py -f testdns.txt google.co.uk.
server             avg(ms)     min(ms)     max(ms)     stddev(ms)  lost(%)  ttl        flags                  response
----------------------------------------------------------------------------------------------------------------------
213.120.234.42     13.749      13.388      14.660      0.443       %0       270        QR -- -- RD RA -- --   NOERROR
213.120.234.38     13.901      13.231      14.570      0.355       %0       235        QR -- -- RD RA -- --   NOERROR
8.8.8.8            19.227      14.664      24.878      4.504       %0       300        QR -- -- RD RA -- --   NOERROR
212.159.6.10       13.437      13.150      13.980      0.224       %0       135        QR -- -- RD RA -- --   NOERROR
212.159.13.49      13.684      13.080      15.101      0.618       %0       98         QR -- -- RD RA -- --   NOERROR
212.159.6.9        13.093      12.502      13.451      0.328       %0       96         QR -- -- RD RA -- --   NOERROR
212.159.13.50      13.898      12.934      14.445      0.438       %0       69         QR -- -- RD RA -- --   NOERROR

Edit - after posting it, it does seem to work in a mobile browser too, the text box has its own floating horizontal scrollbar!

Thanks again.

Townman · ‎22-08-2007

That is a great "build" on the idea.

Manipulating container sizes in HTML is black magic! I tried several "proper" solutions in the arena of controlling wrap and overflow, none of which I could get to work ... before going for the brutal hack of over sizing the container.

In another browser tab, login into the Plusnet user portal BEFORE clicking the fault & ticket links

Superusers are not staff, but they do have a direct line of communication into the business in order to raise issues, concerns and feedback from the community.

If this post helped, please click the Thumbs Up and if it fixed your issue, please click the This fixed my problem green button below.

seebee · ‎08-07-2017

(I thought I'd combine our findings into a single post with instructions and pictures, so hopefully it is useful for others. Is it worth making this a "sticky" somewhere for future reference?)

How to paste long lines of spaced text without wrapping

Thanks to @Townman

1) Screenshots are from a desktop PC, as typically you would be pasting from a command line window for example

2) "Start a Topic" or "Reply" to an existing topic

3) Click on the "..." three dots, to "expand toolbar"

4) Click on the "</>" icon to "Insert/Edit code sample"

5) Leave the language at the default of "HTML/XML". Paste your text into the small window, and click OK

6) You see the text in a box, but it is still wrapping. Click the "HTML" button to see "Source Code"

7) In the Source Code box, replace the opening <li-code lang="markup"> with <pre style="white-space: pre;">

8 ) Scroll down and replace the closing </li-code> with </pre> then click OK

9) You can now see the text box is no longer wrapping. Scroll down and it has its own horizontal scrollbar now. You can type below or above the box as usual.

For example :

pi@rPi3b:~ $ dnseval.py -f testdns.txt bbc.co.uk.
server             avg(ms)     min(ms)     max(ms)     stddev(ms)  lost(%)  ttl        flags                  response
----------------------------------------------------------------------------------------------------------------------
213.120.234.42     14.031      13.128      15.111      0.559       %0       224        QR -- -- RD RA -- --   NOERROR
213.120.234.38     13.704      13.315      14.682      0.385       %0       284        QR -- -- RD RA -- --   NOERROR
8.8.8.8            14.072      13.615      14.575      0.334       %0       222        QR -- -- RD RA -- --   NOERROR
212.159.6.10       14.428      12.830      23.987      3.379       %0       32         QR -- -- RD RA -- --   NOERROR
212.159.13.49      13.097      12.406      13.765      0.451       %0       32         QR -- -- RD RA -- --   NOERROR
212.159.6.9        13.097      12.516      13.647      0.367       %0       182        QR -- -- RD RA -- --   NOERROR
212.159.13.50      13.743      13.058      15.260      0.613       %0       182        QR -- -- RD RA -- --   NOERROR

The box above should display with its own horizontal scrollbar and no wrapping, on mobile and desktop browsers.