Layout is broken if some preformated content is used.

[lwandrebeck]

Hi,

I’ve just done a new post with

some long shell output

content. When listing posts in a category, text goes outside its « frame ».

I’ll try to fix that myself and propose a PR, but given I’m not at all a front-end guy (and time is sparse), if anyone knows easily how to fix that, go ahead.

Thanks !

[tchartron]

Hi and thanks for using blow !

I'll try to help but it's been a while since i edited content using Zola ...

Try to wrap the code in a markdown code block like this :

<h1>h1 Heading</h1>
<h2>h2 Heading</h2>
<h3>h3 Heading</h3>
<h4>h4 Heading</h4>
<h5>h5 Heading</h5>
<h6>h6 Heading</h6>

Using triple backticks around your code

It should add a overflow-x: auto; to the built html page and allow auto scrolling when the line is too long.
If it does not help, please give me a link to your blog so i can inspect to find why this is happening.

[lwandrebeck]

Hi,
sorry for the delay.
Adding <h6>```sh bla bla```</h6> does break lines, but no scrolling. Adding inside the ```sh <h6> bla bla </h6> ``` does render <h6> and </h6> as is. Or did I misunderstand what you proposed ?
You can have a look at https://www.quelquesmots.fr/IT/
Thanks !

[tchartron]

Hi !

My turn to be sorry for the delay @lwandrebeck 😄
I was not able to reproduce the issue, but as i can see on your website it seems that you fixed it already !
Maybe you can post the solution here so anyone facing it will find your solution.
Thank you !

[lwandrebeck]

Hi ! No problem @tchartron . I’ve simply moved preformatted content from the post summary (before <!-- more -->) after the <!-- more --> so it’s not displayed anymore unless you click on the post to read it as a whole. So not fixed, but worked around ;-)