Neo
June 28, 2018, 7:57am
21
The scroll bars were not working before, so nothing will be different
We can't have it both ways. If they don't work, we must disable them. If they are disabled, then obviously they won't work, LOL
Feel free to post a screenshot with a description of any issues!
I take your point but, like many apps do, would active scroll bars just appear if the post was too wide for the screen or too long for the page? We are all familiar with seeing such functionality every day.
In fact, we see it on this site when, for whatever reason, some complete posts are wider than screen. Scroll bars seem to simply appear in that situation.
Neo
June 28, 2018, 8:49am
23
The current code for the code tags looks like this:
<style>
pre {
overflow:hidden;
margin:2px;
padding:15px;
border:1.2px solid;
margin-right:10px;
}
</style>
<br />
<br />
<div class="smallfont" style="margin-bottom:2px;">$vbphrase:</div>
<pre class="alt2">$code</pre></div><br />
So, the action should be as for the CSS attribute:
overflow:hidden;
The overflow property has the following values:
visible - Default. The overflow is not clipped. It renders outside the element's box
hidden - The overflow is clipped, and the rest of the content will be invisible
scroll - The overflow is clipped, but a scrollbar is added to see the rest of the content
auto - If overflow is clipped, a scrollbar should be added to see the rest of the content
Nothing has ever worked correctly on this because of the pre
tag used for code tags; however, if you want to try, we can try another value for the overflow attribute, for example "auto".
But honestly, we have tried all before and they did not work.
Which CSS overflow attribute do you want to try now?
Want to try auto
again?
Update:
Now trying this code:
<style>
pre {
overflow:auto;
margin:2px;
padding:15px;
border:1.2px solid;
margin-right:10px;
}
</style>
<br />
<br />
<div class="smallfont" style="margin-bottom:2px;">$vbphrase:</div>
<pre class="alt2">$code</pre></div><br />
Neo
June 28, 2018, 8:54am
24
Testing:
01234567890123456789012345678901234567890123456789012345678901234567890123456789012345678901234567890123456789012345678901234567890123456789012345678901234567890123456789012345678901234567890123456789 0123456789012345678901234567890123456789012345678901234567890123456789012345678901234567890123456789012345678901234567890123456789012345678901234567890123456789 012345678901234567890123456789012345678901234567890123456789012345678901234567890123456789012345678901234567890123456789012345678901234567890123456789012345678901234567890123456789012345678901234567890123456789012345678901234567890123456789
Neo
June 28, 2018, 8:56am
26
The problem is that scrollbars do not work with the HTML pre
tag.
If you have better HTML/CSS code for code tags, we can try it.
Thanks.
1 Like
Neo
June 28, 2018, 11:42am
27
It is interesting to note that the mobile code does not have this issue and we can scroll without scrollbars with finger gestures on mobile.
Neo
June 29, 2018, 12:35am
28
OK... after digging around, I think I'll try to change our code tags to use:
SyntaxHighlighter
See also:
SyntaxHighlighter 3.0.83
Neo
June 29, 2018, 12:41am
29
hicksd8:
I take your point but, like many apps do, would active scroll bars just appear if the post was too wide for the screen or too long for the page? We are all familiar with seeing such functionality every day.
In fact, we see it on this site when, for whatever reason, some complete posts are wider than screen. Scroll bars seem to simply appear in that situation.
OK. I think I will install and test:
SyntaxHighlighter v4
... and see if I can completely redo / replace our current code tag code.
Thanks.
Neo
June 29, 2018, 8:47am
30
Update:
I added a new kit and code for the code tags. See this thread:
New Code Tags (Syntax Highlighting)