title: how to force user to scroll to view content in html
body: <p>Sorry I am very new to html and css</p>
  
  <p>I am making a website in html and css and want user to scroll down to view the content below. There is only logo and tagline on the screen. If I try to add image it shows below the logo, but I don't want to do that. Is there any way to force user to scroll to view the content further?</p>
  
  <p>Thanks and once again, sorry.</p>
  
  <p>Edit: here is the code:</p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
  &lt;head&gt;
  &lt;title&gt;MSN&lt;/title&gt;
  &lt;meta charset="utf-8" /&gt;
  &lt;link type="text/css" rel="stylesheet" href="styles.css" /&gt;
  &lt;/head&gt;
  &lt;body class="body" style="overflow-y:hidden"&gt;
  &lt;center&gt;
  &lt;div class="main"&gt;&lt;br&gt;&lt;br&gt;&lt;br&gt;&lt;br&gt;&lt;br&gt;&lt;br&gt;&lt;br&gt;
  &lt;img class="logo" src="logo.png"&gt;
  &lt;div class="tiles"&gt;
  &lt;button class="t1"&gt;&lt;/button&gt;
  &lt;button class="t2"&gt;&lt;/button&gt;
  &lt;button class="t3"&gt;&lt;/button&gt;
  &lt;button class="t4"&gt;&lt;/button&gt;
  &lt;button class="t5"&gt;&lt;/button&gt;
  &lt;button class="t6"&gt;&lt;/button&gt;
  &lt;button class="t7"&gt;&lt;/button&gt;
  &lt;button class="t8"&gt;&lt;/button&gt;
  &lt;/div&gt;
  &lt;/div&gt;
  &lt;/center&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>CSS:</p>
  
  <pre><code>.body {
  background-color: #ffffff;
  background-image:url(background.jpg);
  }
  
  .logo {
  position: absolute;
  left: 42%;
  top: 25%;
  }
  
  .tiles{
  position: absolute;
  bottom: 20%;
  white-space:nowrap
  }
  
  .t1 {
  background-image:url(tiles/t1.jpg);
  height:119px;
  width:210px;
  border:0px solid #ffffff;
  }
  
  .t1:hover{
  background-image:url(tiles/t1-1.jpg)
  }
  </code></pre>