Welcome to the Question2Answer Q&A. There's also a demo if you just want to try it out.
0 votes
in Plugins by


Hi, I'm testing Q2A for my site and I'm already customized installation for my needs, but I have an issue in syntax highlighting long pieces of code (I absolutely need this for my site) that need scrollbars to scroll the whole code without to create a too long area in page
for syntax highliting I use:
Markdown Editor plugin
but scrollbars (lke into stackoverflow posts) are not present and long lines go out of posting area . Do you know some workaround to have scrollbars when the code posted is larger anbd longer that a fixed value in chars?
Q2A version: 1.6

2 Answers

+1 vote

Check the file ./qa-plugin/q2a-markdown-editor-master/pagedown/wmd.css for the .wmd-preview pre selector. You can decrease the value of max height to your desired requirements editing max-height:400px property. If this does not work:

  1. Try to set the !important rule like this max-height:400px !important
  2. Be sure that selector .wmd-preview pre is a block element (display:block)
  3. Verify if exists the overflow:auto property
you are right, I'm sorry to not written before

this is the test url

In this case, just add "pre{max-height:300px}" into your default CSS theme file.
this works very well, I found that setting the *pre{max-height:300px}* works better than setting a fixed height, Now I have only study to find a way to have a select button for all code contained in textarea beetween scrollbars, but this is another matter. Great support!
In your case, you should not use fixed height. Also, increase the width of "pre" element (at least 600px).
+1 vote

This is may not the editor issue but the theme itself. Snow theme also having this bug and I will fix it soon. However if editor's inline css may override theme styelsheet and that also cause such issue.

you can add below to your stylesheet to cross check.

pre {
background: #f4f4f4;
padding: 0.1em 0.5em 0.3em 0.7em;
border-left: 11px solid #F95225;
margin: 1.7em 0 1.7em 0.3em;
overflow: auto;
width: 98%;
pre code {
background: #eee;
line-height: 1.6em;
font-size: 14px;
font-family: "Courier New", Courier, monospace, sans-serif;
text-align: left;
color: #555;
Change value as per your test.

Oops! I think you are not talking about in content area but Markdown editor's preview area. Than you might update it's stylesheet in same way as above.


edited by
well! it seems to partially solve the issue: see:


setting the width to 20%, I get the horizontal scrollbar


do you think there is a way to have also a VERTICAL SCROLLBAR?

EDIT: I settled a fixed width

width: 300px;
height: 450px;

for width and height and now I have vertical and horizontal scrollbar

but any improvement you can suggest will be very well accepted!

many thanks to everyone for now