Hello,
I create a website with a 1024 x 728 size. After I create the html amazingly, the horizontal space is more than 1024, larger than the background that I create. There are around 400 px more space to right side of the background which is filled with a blank white space ( I wonder why?).
I do not want to see horizontal scroll in my website only vertical scroll.
This is my whole website css.
style.css
body{background-image1:url('../images/indonusa3.jpg'); background-repeat: repeat-y; background-position: center top; height: 800px; }
#logo {margin: 10px 0 0 10px; }
#navigation {background-image:url('../images/nav.jpg'); background-repeat: repeat-x; width: 900px; height: 80px; z-index: 2; border-radius: 10px; border-style:solid; border-width: 1px; border-color: gray; margin-left: auto; margin-right: auto; margin-top: 50px;}
#search {margin: -45px 0 0 720px;}
input {width: 100px; height:30px;}
#sbutton {margin: -28px 0 0 827px;}
#slidesnav {margin-top: 400px; }
#products { margin: 50px 0 0 250px; }
#fnav {background-color: white; width: 900px; height: 50px; border-radius: 10px; border-style:solid; border-width: 1px; border-color: gray; margin-left: auto; margin-right: auto; margin-top: 20px;}
#fnav ul {list-style-type: none; margin:0; padding:0; text-align:right; margin-top:10px; margin-right:5px; }
#fnav ul li {display: inline; }
#fnav ul li a{text-decoration: none; color: black; font-family: arial; font-size: 11px; padding: .2em .5em;}
#fnav ul li a:hover{text-decoration: underline;}
/* special for slideshow navigation */
#slideshow { left: 35px; float: left; margin: 10px; z-index: 0;}
#nav { width: 270px; margin: 170px 0 0 225px; float: left; position: absolute; z-index: 1;}
#nav li { float: left; margin: 0 0 0 4px; list-style: none; background: url(../images/slidesnav1.jpg) no-repeat top;}
#nav a { width: 20px; height: 20px; padding: 0px; display: block; border: 0px solid #ccc;}
#nav li.activeSlide a { /* background: #88f */ background: url(../images/slidesnav2.jpg) no-repeat top;}
#nav a:focus { outline: none;}
#nav img { border: none; display: block;}
pre { clear: left }
/* end slideshow nav */