How do I get text within <pre> tag to wrap?

Could you just use the indent options with maybe italics?

Can you share an image of what you are seeing?  

I think a pre tag specifically preserves spacing and line breaks.  Manually using the pre tag is working fine for me.

Hello again Andrew, 

No, I don't think indenting would get the look I'm going for. 

Here's what I have now. I edited the HTML to look like this:

And that produces this:

The "tip" box has a scrollbar because by default, the <pre> tags do not wrap text. I know there is a way to change that, but I don't know how so I'm here asking for help with that.

I had tried manually breaking the lines myself, but then the it looks really weird on mobile because there are random line breaks. 

Here is what I ideally want it to look like when the lines break automatically:

Hello Mollie,

Try this in your css

pre { 
white-space: pre-wrap; /* css-3 */ 
white-space: -moz-pre-wrap; /* Mozilla, since 1999 */ 
white-space: -pre-wrap; /* Opera 4-6 */ 
white-space: -o-pre-wrap; /* Opera 7 */ 
word-wrap: break-word; /* Internet Explorer 5.5+ */ 
}

Got it working, thank you!

Hi,

I'm having the same problem as Mollie. In this case, it's raw HTML code that needs to wrap. Regarding the previous comment per adding the below to css:

pre { 
white-space: pre-wrap; /* css-3 */ 
white-space: -moz-pre-wrap; /* Mozilla, since 1999 */ 
white-space: -pre-wrap; /* Opera 4-6 */ 
white-space: -o-pre-wrap; /* Opera 7 */ 

1) Why don't I see mention of Chrome, Edge, Firefox, etc. ?

2) Is there a missing } at the end of the code block?

3) Would the CSS apply to this article only, or the entire Guide Knowledge Base. I'm a bit skittish about making a change that could effect numerous articles.

4) Please point me in the right direction to an article that will tell me how to update our CSS. I'm an admin, so I should have access.

5) If I don't want to deal with the mechanics of code blocks, can I have Zendesk render the same font some other way?

Thanks,

Stephen

You could use on-line styles to avoid making this global. You'll want to look up articles on editing your theme. This requires a paid guide plan I believe.

Thank you. Pleas see above: why is Chrome not listed in the specified browsers?

pre { 
white-space: pre-wrap; /* css-3 */ 
white-space: -moz-pre-wrap; /* Mozilla, since 1999 */ 
white-space: -pre-wrap; /* Opera 4-6 */ 
white-space: -o-pre-wrap; /* Opera 7 */