[code][/code] scroll bar in posts

[Tovaana]

When I post codes in posts with long text, it stretches the code and creates a scroll bar within the post. I guess it's good that it's not stretching my site period, but I'd rather it wrap within the code box instead of stretching it with the scroll bar. Is there a way to fix this? 

[Retread]

Mar 31, 2020 15:27:58 GMT -8 Tovaana said:

When I post codes in posts with long text, it stretches the code and creates a scroll bar within the post. I guess it's good that it's not stretching my site period, but I'd rather it wrap within the code box instead of stretching it with the scroll bar. Is there a way to fix this? 

Hi Tovaana

Can you provide a link to a post where this happens? This really shouldn't be the case on a ProBoards forum, unless someone has styled the code element in the Style Sheet. Normally code is styled to remove extra whitespace (flatten) and wrap long lines.

Like most elements in the BBCode used on ProBoards, the code element will support inline styling, and the format would be like this:

[code style="property1:value1;property2:value2;"]Code goes here[/code]

Replace property1:value1;property2:value2; with any number of style properties and values, being mindful of separating the property and value with a colon and separating each property:value pair with a semicolon.

I really should see this in-situ before recommending the necessary styling, so a link would be useful.

[Tovaana]

Retread Thank you for replying promptly!

Yeah, I used a plug in theme for my layout... so they must have changed the coding):

Here's the thread with the example: vernazzaweyr.boards.net/thread/2/character-templates?page=1&scrollTo=3

I have some coding experience, but I'm still very noob. 

Thank you so much for the help!

[Retread]

Mar 31, 2020 21:45:56 GMT -8 Tovaana said:

Here's the thread with the example: vernazzaweyr.boards.net/thread/2/character-templates?page=1&scrollTo=3

Tovaana , as a guest I wasn't allowed to access that thread. But I did post a thread to test the behavior of the code element, here:
vernazzaweyr.boards.net/thread/4/testing-code-boxes

In the second instance of using a code element, I used in-line styling as such:
[code style="white-space:pre-wrap;"]
Feel free to delete that thread, as it is no longer needed.

---

In your Style Sheet (scroll to roughly 2/3 of the way down), you have this line:

.posts .post .message code{display:block;border:1px solid #555555;padding:5px;margin-left:16px;margin-right:16px;background:transparent;color:#fff7bb;white-space:pre;}

If you change the white-space property from a value of pre to pre-wrap, I reckon that will get you the behavior you desire.

.posts .post .message code{display:block;border:1px solid #555555;padding:5px;margin-left:16px;margin-right:16px;background:transparent;color:#fff7bb;white-space:pre-wrap;}

[Tovaana]

Retread AHhhhh! Thank you so much! That worked perfectly<3