html - Vertical scrollbar appearing involuntarily -


vertical scrollbar appearing in page. have no iea causing it. i've tried adding display: block , display: block-inline children did not work. had set these width weird % values seem stop working anyway.

<!doctype html> <html>    <head>     <title>code together</title>     <!--reference css-->     <link href="/styles/frontpage.css" rel="stylesheet" type="text/css" />      <!--reference jquery library-->     <script src="/scripts/jquery-2.2.1.js"></script>     <!--reference signalr library. -->     <script src="scripts/jquery.signalr-2.1.2.min.js"></script>     <!--reference autogenerated signalr hub script. -->     <script src="/signalr/hubs"></script>     <!--reference ace-->     <!--<script src="~/scripts/roomfunctions.js" type="text/javascript" charset="utf-8"></script>-->   </head>    <body>     <div id="container">       <div id="header">         <h1>code </h1>       </div>       <div id="main">            <form method="get" action="/room.cshtml">           <div id="creator">             <input type="text" name="chatroom" id="joinroom" placeholder="room id" />           </div>           <div id="creatorbuttons">             <input type="button" id="join" value="join room" />             <input type="submit" id="create" value="create new room" />           </div>         </form>          <script>           $('#join').click(function() {             if ($('#joinroom').is(':hidden')) {               $('#joinroom').slidedown(450);               $('#joinroom').focus();             } else {               $(this).attr({                 type: 'submit'               })             }           });           $('#create').click(function() {             var randomvalue = math.floor((math.random() * 1000) + 1);             var randomvalue2 = (math.random().tostring(36) + '00000000000000000').slice(2, 6 + 2);             $('#joinroom').attr({               value: randomvalue2.tostring()             })           });          </script>        </div>       <div id="footer">         &copy; 2016 code       </div>     </div>    </body>  </html> 

css file:

@font-face {   font-family: kongtext;   src: url('kongtext.ttf'); }  html, body {   background-color: highlight;   font-family: kongtext;   height: 96%;   width: 100%;   margin: 0;   padding: 0; }  #container {   height: 100%; }  #header {   height: auto;   font-size: 2em;   text-align: center; }  #main {   height: 83.3%;   width: 100%;   margin: 0 auto; }  #footer {   font-size: 13px;   position: fixed;   bottom: 0;   right: 0; }   /*default.cshtml*/  #creator {   width: 350px;   margin: auto;   margin-top: 10%;   display: flex; }  #joinroom {   background-color: coral;   height: 50px;   width: 346px;   font-size: 30px;   display: none; }  #creatorbuttons {   width: 350px;   margin: auto; }  #join {   background-color: coral;   width: 350px;   height: 50px;   font-family: kongtext;   font-size: 1.4em; }  #create {   background-color: coral;   width: 350px;   height: 50px;   font-family: kongtext;   font-size: 1.3em;   margin-top: 1px; }   /*all editors*/  .site {   display: inline-block; }  #editors {   height: 100%;   width: 100%; }  #selectors {   height: 3%;   width: 100%; }  .allselectors {   display: inline-block; }  #selector1 {   width: 40%;   position: relative; }  #selector2 {   width: 60%; }  .modefirst {   float: left;   margin-top: 0.3%; }  .modesecond {   float: right;   margin-top: 0.3%; }  #first, #third {   height: 100%;   width: 40%; }  #second {   height: 100%;   width: 20%; }   /*room.cshtml*/  .site {   vertical-align: bottom; }  .chatbox {}  #chatbox {   display: block;   resize: none;   height: 92%;   width: 100%;   -webkit-box-sizing: border-box;   -moz-box-sizing: border-box;   box-sizing: border-box; }  #message {   display: block;   height: 4%;   width: 100%;   -webkit-box-sizing: border-box;   -moz-box-sizing: border-box;   box-sizing: border-box; }  #msgsend {   height: 4%;   width: 100%; } 

have tried using overflow-y: hidden or auto? auto add scroll bar if there overflow. try adding body css.


Comments

Popular posts from this blog

java - Run spring boot application error: Cannot instantiate interface org.springframework.context.ApplicationListener -

python - pip wont install .WHL files -

Excel VBA "Microsoft Windows Common Controls 6.0 (SP6)" Location Changes -