How to fix double vertical scroll bar in responsive output

Question

After implementing the solution provided for the question 'Responsive HTML5 Output: How to auto adjust the screen resolution for all devices?', the function bar in output does not appear and also another vertical scroll bar in the output. I edited the max-width value in the layoutfix.min.css file and fixed the function bar issue. How can I do away with the additional vertical scroll bar?

Answer 1

I've looked into the issue.
@Delennish: In your case, the size of the iframe is too large, or you have an extra empty element below the iframe. You can try 2 things:
1. Best solution but may have side effects: In the main.css, add the following code:
div.contentholder { overflow: hidden !important;}
For this option, please check for undesired side effects.
2. Works, but is ugly: In the main.css, add the following code:
div.floatholder iframe.wTopic { height: 95% !important;}
Try playing with the height setting until the 2nd scrollbar disappears.
@CarolW: The layout you're using is very old. I've made a new responsive layout with TOC only. Please use that one instead: http://www.wvanweelden.eu/sites/default/files/attachments/Theme1_Standard_TOC_Only.zip (I'll update my site with this new version later.)