title: why my html page is showing half page?
body: <p>i cant understand that my html page is not showing with full page... It is showing from the top to the half. Here is my HTML code. Where is the css style that shows page from half?</p>
  
  <pre><code>&lt;!-- Latest compiled and minified CSS --&gt;
  &lt;link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css"&gt;
  
  &lt;!-- Latest compiled and minified JavaScript --&gt;
  &lt;script src="http://code.jquery.com/jquery-latest.min.js"&gt;&lt;/script&gt;
  &lt;script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/js/bootstrap.min.js"&gt;&lt;/script&gt;
  &lt;style type="text/css"&gt;
  .chat
  {
      list-style: none;
      margin: 0;
      padding: 0;
  }
  
  .chat li
  {
      margin-bottom: 10px;
      padding-bottom: 5px;
      border-bottom: 1px dotted #B3A9A9;
  }
  
  .chat li.left .chat-body
  {
      margin-left: 60px;
  }
  
  .chat li.right .chat-body
  {
      margin-right: 60px;
  }
  
  
  .chat li .chat-body p
  {
      margin: 0;
      color: #777777;
  }
  
  .panel .slidedown .glyphicon, .chat .glyphicon
  {
      margin-right: 5px;
  }
  
  .panel-body
  {
      overflow-y: scroll;
      height: 250px;
  }
  
  ::-webkit-scrollbar-track
  {
      -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
      background-color: #F5F5F5;
  }
  
  ::-webkit-scrollbar
  {
      width: 12px;
      background-color: #F5F5F5;
  }
  
  ::-webkit-scrollbar-thumb
  {
      -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);
      background-color: #555;
  }
  
  &lt;/style&gt;
  
  
  
  
              &lt;div class="panel panel-primary"&gt;
                  &lt;div class="panel-heading"&gt;
                      &lt;span class="glyphicon glyphicon-comment"&gt;&lt;/span&gt; Chat
                      &lt;div class="btn-group pull-right"&gt;
                          &lt;button type="button" class="btn btn-default btn-xs dropdown-toggle" data-toggle="dropdown"&gt;
                              &lt;span class="glyphicon glyphicon-chevron-down"&gt;&lt;/span&gt;
                          &lt;/button&gt;
                          &lt;ul class="dropdown-menu slidedown"&gt;
                              &lt;li&gt;&lt;a href="http://www.jquery2dotnet.com"&gt;&lt;span class="glyphicon glyphicon-refresh"&gt;
                              &lt;/span&gt;Refresh&lt;/a&gt;&lt;/li&gt;
                              &lt;li&gt;&lt;a href="http://www.jquery2dotnet.com"&gt;&lt;span class="glyphicon glyphicon-ok-sign"&gt;
                              &lt;/span&gt;Available&lt;/a&gt;&lt;/li&gt;
                              &lt;li&gt;&lt;a href="http://www.jquery2dotnet.com"&gt;&lt;span class="glyphicon glyphicon-remove"&gt;
                              &lt;/span&gt;Busy&lt;/a&gt;&lt;/li&gt;
                              &lt;li&gt;&lt;a href="http://www.jquery2dotnet.com"&gt;&lt;span class="glyphicon glyphicon-time"&gt;&lt;/span&gt;
                                  Away&lt;/a&gt;&lt;/li&gt;
                              &lt;li class="divider"&gt;&lt;/li&gt;
                              &lt;li&gt;&lt;a href="http://www.jquery2dotnet.com"&gt;&lt;span class="glyphicon glyphicon-off"&gt;&lt;/span&gt;
                                  Sign Out&lt;/a&gt;&lt;/li&gt;
                          &lt;/ul&gt;
                      &lt;/div&gt;
                  &lt;/div&gt;
                  &lt;div class="panel-body"&gt;
                      &lt;ul class="chat" id="chatcontent"&gt;
                          &lt;li class="left clearfix"&gt;&lt;span class="chat-img pull-left"&gt;
                              &lt;img src="http://placehold.it/50/55C1E7/fff&amp;text=U" alt="User Avatar" class="img-circle" /&gt;
                          &lt;/span&gt;
                              &lt;div class="chat-body clearfix"&gt;
                                  &lt;div class="header"&gt;
                                      &lt;strong class="primary-font"&gt;Jack Sparrow&lt;/strong&gt;
                                  &lt;/div&gt;
                                  &lt;p&gt;
                                      Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur bibendum ornare
                                      dolor, quis ullamcorper ligula sodales.
                                  &lt;/p&gt;
                              &lt;/div&gt;
                          &lt;/li&gt;
                      &lt;/ul&gt;
                  &lt;/div&gt;
                  &lt;div class="panel-footer"&gt;
                      &lt;div class="input-group"&gt;
                          &lt;input id="btn-input" type="text" class="form-control input-sm" placeholder="Type your message here..." /&gt;
                          &lt;span class="input-group-btn"&gt;
                              &lt;button class="btn btn-warning btn-sm" id="btn-chat" onclick="sendmessage();"&gt;
                                  Send&lt;/button&gt;
                          &lt;/span&gt;
                      &lt;/div&gt;
                  &lt;/div&gt;
              &lt;/div&gt;
  &lt;script type="text/javascript"&gt;
  function sendmessage()
  {
  var message = document.getElementById('btn-input').value;
  var chatcontent = "";
  chatcontent += document.getElementById('chatcontent').innerHTML;
  var strVar="";
  strVar += "                        &lt;li class=\"left clearfix\"&gt;&lt;span class=\"chat-img pull-left\"&gt;";
  strVar += "                            &lt;img src=\"https:\/\/cdn2.iconfinder.com\/data\/icons\/windows-8-metro-style\/64\/user.png\" alt=\"User Avatar\" class=\"img-circle\" \/&gt;";
  strVar += "                        &lt;\/span&gt;";
  strVar += "                            &lt;div class=\"chat-body clearfix\"&gt;";
  strVar += "                                &lt;div class=\"header\"&gt;";
  strVar += "                                    &lt;strong class=\"primary-font\"&gt;Bhaumik Patel&lt;\/strong&gt;";
  strVar += "                                &lt;\/div&gt;";
  strVar += "                                &lt;p&gt;";
  strVar += message;
  strVar += "                                &lt;\/p&gt;";
  strVar += "                            &lt;\/div&gt;";
  strVar += "                        &lt;\/li&gt;";
  
  chatcontent += strVar;
  document.getElementById('chatcontent').innerHTML = chatcontent;
  document.getElementById('btn-input').value = '';
  }
  
  $.fn.enterKey=function(fnc){return this.each(function(){$(this).keypress(function(ev){var keycode=(ev.keyCode?ev.keyCode:ev.which);if(keycode=='13'){document.getElementById("btn-chat").click();}})})}
  $("#btn-input").enterKey(function(){sendmessage();});
  &lt;/script&gt;
  </code></pre>
  
  <p>And here is the screenshot:</p>
  
  <p><img src="https://i.stack.imgur.com/y2L07.png" alt="enter image description here"></p>