html - My website has some empty spacing I can't get rid of -


i developing simple website , have encountered error in layout. have random right of webpage isn't visible , can scroll , don't know how rid of it. there isn't going on in html here css of project.

    @import url(http://nicholastodor.com/sf/usesf.css);  html {     width: 100%;     height: 100%; }  body {     background-color: black;     width: 100%;     height: 100%; }  #developmenttitle {     margin: auto;     font-family: "avenir next";     color: lightgrey;     font-size: 19px;     vertical-align: middle;     left: 13%;     top: 103%;     position: relative;     -ms-transform: translate(0,-100%); /* ie 9 */     -webkit-transform: translate(0,-100%); /* safari */     transform: translate(0,-100%); }  #development {     margin: auto;     font-family: "avenir next";     color: lightgrey;     font-size: 15px;     vertical-align: middle;     left: 33%;     top: 114%;     position: relative;     -ms-transform: translate(0,-116%); /* ie 9 */     -webkit-transform: translate(0,-116%); /* safari */     transform: translate(0,-116%);   }  #aboutme {     margin: auto;     font-family: "avenir next";     color: lightgrey;     font-size: 15px;     vertical-align: middle;     left: 33%;     top: 117%;     position: relative;     -ms-transform: translate(0,-116%); /* ie 9 */     -webkit-transform: translate(0,-116%); /* safari */     transform: translate(0,-116%);   }  #aboutmetitle {     margin: auto;     font-family: "avenir next";     color: lightgrey;     font-size: 19px;     vertical-align: middle;     left: 13%;     top: 100%;     position: relative;     -ms-transform: translate(0,-100%); /* ie 9 */     -webkit-transform: translate(0,-100%); /* safari */     transform: translate(0,-100%); }  #beginningtitle {     margin: auto;     font-family: "avenir";     color: lightgrey;     font-size: 24px;     text-align: center;     vertical-align: middle;     top: 50%;     position: relative;     -ms-transform: translate(0,-50%); /* ie 9 */     -webkit-transform: translate(0,-50%); /* safari */     transform: translate(0,-50%); } 

it seems translating lot of things, guess of going outside view of screen,

use overflow: hidden on parent of these translated elements see if works

or else maybe default css being applied, can reset html, body etc

or check dom pesticide chrome different elements have (it give them multi-colored borders testing) , see 1 going out of screen, , handle it.

we can better if upload markup too, or better use jsbin or jsfiddle , edit how should , give back,


Comments

Popular posts from this blog

c# - Validate object ID from GET to POST -

node.js - Custom Model Validator SailsJS -

php - Find a regex to take part of Email -