13

I'm trying to display some HTML files that have code samples, surrounded by codeblock tags. Is there any CSS styling that could display codeblocks as if they were pre tags? (respect newlines, respect whitespace, etc)

2
  • 1
    And the reason you can't use pre or code tags is...?
    – j08691
    Mar 1, 2012 at 17:42
  • Correct, thats what I ended up doing. Find and replace "codeblock" with "pre" ... everythings cool now. Mar 3, 2012 at 10:17

2 Answers 2

33

Like this

div { white-space: pre; }
1
  • 5
    I'd suggest adding font-family: monospace;. Feb 19, 2015 at 8:33
1

If you want to get pretty fancy, consider a libraries like Pygments or highlight.js that will do full syntax coloring, in addition to pretty printing of your code.

Pygments would be implemented in server-side Python; highlight.js works browser side.

OR: use a browser-based "code editor" such as Ace, which will then format/color the code... and just use the control in a read-only fashion.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.