Currently, I am facing an issue while trying to insert code into one of my blog posts. To maintain the formatting, I decided to enclose the code within <pre>
tags. However, due to Twenty Thirteen's fixed width template, the <pre>
tags get compressed and the formatting breaks. Even though manually setting a width resolves the issue, it makes the post too wide and looks incorrect.
In an attempt to solve this problem, I experimented with inline CSS before making changes to my child template. The code snippet I tried includes:
<pre style="width: 100%; overflow-x: scroll;">
I have tested various other configurations (including setting overflow to auto) but none have provided a solution. It seems like the theme itself may be causing this issue, although the exact reason remains unclear to me. If you wish to view the affected post, you can access it HERE. For now, I have reverted the inline CSS back to the fixed width to ensure correct display.