HUGO

Prevent code block from scrolling in Zen theme

I’m using the Zen theme (and it is lovely!) but I notice that code blocks appear in a window ~12 lines long with a scrollbar.

Is there a way to either tell Zen to render the whole thing without a scrollbar, or to increase the max size of the window? I’m hoping there is some built-in attribute magic I can use on the code fence block.

Hi there,

What you want can be accomplished using CSS, however CSS questions are outside the scope of this forum.

The CSS that controls the code/pre tags are in the “_zen.scss” file, line 122-150.

Copy the “_zen.scss” file over to ?your/project/root/assets/sass/` and edit it there.

Or just add an empty copy of the “_zen.scss” file there, to clear out all custom styles. The “Zen” styles are just styles I happen to use in most of my own projects.

This topic was automatically closed after 18 hours. New replies are no longer allowed.