No Scroll bar appears when I run my site through a browser with my slide out menu position set to fixed <p>I have just started coding websites. I just recently started a website for a friend and though it would be cool to have a slide out menu that slide out from the top rather than the left or right of the page. However having done so and got it to work and all then having added some other content to the page have found that I am unable to get a scroll bar when processed through a browser. I have tried in the body tag, "overflow;scroll" which did not work and I have tried adding a div with the height of 3000px</p> <p>Pls if anyone can help that will be great I will attach all my css and html (take note there is some jQuery and java)</p> <p>Thanks</p> <p>HTML &amp; Java</p> <pre><code>&lt;!doctype html&gt; &lt;html&gt; &lt;head&gt; &lt;meta charset="utf-8"&gt; &lt;title&gt;Josh Site&lt;/title&gt; &lt;link rel="stylesheet" type="text/css" href="../CSS/index.css"&gt; &lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"&gt;&lt;/script&gt; &lt;script src="../jQuery/jquery.cycle2.min.js"&gt;&lt;/script&gt; &lt;script src="../jQuery/jquery.cycle2.video.js"&gt;&lt;/script&gt; &lt;script src="../jQuery/jquery.cycle2.carousel.min.js"&gt;&lt;/script&gt; &lt;meta name="viewport" content="width=device-width, initial-scale=1"&gt; &lt;/head&gt; &lt;!--Skeleton for Slide out Menu--&gt; &lt;body class="menu menu-open"&gt; &lt;header&gt; &lt;nav class="menu-side"&gt; &lt;!--Content for Menu Side--&gt; &lt;ul&gt; &lt;li&gt;&lt;a href="#"&gt;&lt;/a&gt;Item 1&lt;/li&gt; &lt;li&gt;&lt;a href="#"&gt;&lt;/a&gt;Item 2&lt;/li&gt; &lt;li id="logo"&gt;&lt;img src="../../Assets/Josh-Logo.png" alt="Josh Meyers"&gt;&lt;/li&gt; &lt;li&gt;&lt;a href="#"&gt;&lt;/a&gt;Item 3&lt;/li&gt; &lt;li&gt;&lt;a href="#"&gt;&lt;/a&gt;Item 4&lt;/li&gt; &lt;/ul&gt; &lt;!--End of Content for Menu Side--&gt; &lt;/nav&gt; &lt;/header&gt; &lt;!--End of Skeleton for Slide out Menu--&gt; &lt;!--Button to Toggle "Menu Side"--&gt; &lt;a href="#" class="menu-toggle"&gt;&lt;img src="../../Assets/top-menu-icon.png" width="50px" height="50px" alt=""/&gt;&lt;/a&gt; &lt;!--End of Button to Toggle "Menu Side"--&gt; &lt;!--Josh Meyers about and Title--&gt; &lt;div id="Josh-Meyers"&gt; &lt;h1&gt;Josh Meyers&lt;/h1&gt; &lt;p&gt;Photography is the science, art and practice of creating durable images by recording light or other electromagnetic radiation, either electronically by means of an image sensor, or chemically by means of a light-sensitive material such as photographic film.[1] Typically, a lens is used to focus the light reflected or emitted from objects into a real image on the light-sensitive surface inside a camera during a timed exposure. With an electronic image sensor, this produces an electrical charge at each pixel, which is electronically processed and stored in a digital image file for subsequent display or processing. The result with photographic emulsion is an invisible latent image, which is later chemically "developed" into a visible image, either negative or positive depending on the purpose of the photographic material and the method of processing. A negative image on film is traditionally used to photographically create a positive image on a paper base, known as a print, either by using an enlarger or by contact printing. &lt;/p&gt; &lt;/div&gt; &lt;!--Responsive Video Slider and Title--&gt; &lt;div id="Recent-Projects"&gt; &lt;h1&gt;Recent Projects&lt;/h1&gt; &lt;/div&gt; &lt;div id="video-wrapper"&gt; &lt;span class="cycle-prev"&gt;&amp;#9001&lt;/span&gt; &lt;span class="cycle-next"&gt;&amp;#9002&lt;/span&gt; &lt;div class="cycle-slideshow" data-cycle-carousel-visible="3" data-cycle-fx="carousel" data-cycle-timeout="0" data-cycle-auto-height="640:360" data-cycle-prev=".cycle-prev" data-cycle-next=".cycle-next" data-cycle-slides="&gt;iframe" data-cycle-youtube="true" data-cycle-youtube-autostart="true" data-cycle-pager=".cycle-pager" data-cycle-carousel-fluid="true" &gt; &lt;iframe width="560" height="315" src="https://www.youtube.com/embed/7TccWhZ6T8c?rel=0" frameborder="0" allowfullscreen&gt;&lt;/iframe&gt; &lt;iframe width="560" height="315" src="https://www.youtube.com/embed/VPuKbzP2KNM?rel=0" frameborder="0" allowfullscreen&gt;&lt;/iframe&gt; &lt;iframe width="560" height="315" src="https://www.youtube.com/embed/DHW0hQHLpTc?rel=0" frameborder="0" allowfullscreen&gt;&lt;/iframe&gt; &lt;/div&gt; &lt;div class="cycle-pager"&gt;&lt;/div&gt; &lt;/div&gt; &lt;!--End Responsive Video Slider and Title--&gt; &lt;script&gt; (function() { var body = $('body'); $('.menu-toggle').bind('click', function() { body.toggleClass('menu-open', 'toggle-open'); return false; }); })(); &lt;/script&gt; </code></pre> <p></p> <p> </p> <p>CSS</p> <pre><code>body { background-color:black; overflow:scroll; } /*Design for Slide Down menu*/ .menu { overflow:hidden; position:relative; top:0px; -webkit-transition: top 0.8s ease; -moz-transition: top 0.8s ease; transition: top 0.8s ease; } .menu-open { top:231px; } .menu-open .menu-side { top:0px; } .menu-side { background-color:#333; border-bottom:1px solid #000; color:#fff; position:fixed; top:-231px; left:0px; width: 100%; max-width:100%; height: 210px; padding: 10px; -webkit-transition: top 0.8s ease; -moz-transition: top 0.8s ease; transition: top 0.8s ease; } .menu-toggle { position:relative; display:block; width:50px; height:50px; margin-left:auto; margin-right:auto; top:-23.5px; } /*Content style for Menu Side*/ .menu-side ul { width:800px; max-width:100%; height:100px; display:block; text-align:center; margin-left:auto; margin-right:auto; border-style:solid; border-color:white; border-width:thick; -moz-box-shadow:20px 20px 20px 10px black; -webkit-box-shadow:10px 10px 10px 10px 10px black; box-shadow:1px 1px 20px 0.5px black; } .menu-side li { margin-top:auto; margin-bottom:auto; padding:10px; display:inline-block; text-align:center; font-family:Baskerville, "Palatino Linotype", Palatino, "Century Schoolbook L", "Times New Roman", serif; font-size:18px; font-style:italic; } /*Style for Josh Meyers About*/ #Josh-Meyers h1 { text-align:center; color:#FFF; } #Josh-Meyers p { color:#FFF; } /*Style for Video Slide Show and Title*/ #Recent-Projects { text-align:center; height:40px; width:100%; max-width:100%; } #Recent-Projects h1 { text-align:center; color:#FFF; } iframe {max-width:100%} #video-wrapper { width:100%; max-width:100%; height:400px; margin-top:5px; } .cycle-slideshow { width:100%; top:2%; margin-left:auto; max-width:90%; margin-right:auto; } .cycle-prev, .cycle-next { font-size:40px; font-weight:bold; color:#FFF; display:block; position:absolute; top:60%; z-index:999; cursor:pointer; } .cycle-prev {left:2%;} .cycle-next {right:2%;} .cycle-pager { text-align: center; width: 100%; z-index: 999; position: absolute; overflow: hidden; top:85% } .cycle-pager span { font-family: arial; font-size: 50px; width: 16px; height: 16px; display: inline-block; color: #ddd; cursor: pointer; } .cycle-pager span.cycle-pager-active { color: #D69746;} .cycle-pager &gt; * { cursor: pointer;} iframe { padding-left:5px; padding-right:5px; } </code></pre>