No Scroll Options

[coffeeandacasio]

My friend's site won't scroll.
I checked the css and nothing.

It's especially prevalent on the "staff" page.
Check it out here.


http://sasquatchhello.info/

ideas?

[synatribe]

can you provide the css? It could be an overflow:hidden error

[coffeeandacasio]

CODE

/**********************
BIRTHDAY: 14 AUGUST 2009
**********************/
body, html {
margin: 0;
padding: 0;
font: normal 10px 'arial';
color: #000;
background-color: #fff;
text-align: center;
height: 100%;
}

/**********************
LAYOUT
**********************/
#container {
margin: 0 auto;
margin-top: 50px;
margin-bottom: 15px;
padding: 0;
text-align: left;
width: 510px;
min-height: 100%;
height: auto !important;
height: 100%;
z-index: 1;
}

a {
text-decoration: none;
font-weight: normal;
color: #000;
background-color: #f9f9f9;
}

a:hover {
color: #cee768;
}

b {
color: #960081;
}

i {
font-weight: bold;
text-decoration: none;
font-style: normal;
color: #424242;
}

input, textarea {
margin: 2px;
padding: 5px;
background: #fff;
border: 1px solid #e5e5e5;
text-align: left;
font: normal 10px 'arial';
color: #808080;
}
input:focus, textarea:focus {
color: #333;
border: 1px solid #cecece;
}

blockquote {
border: 1px solid #e5e5e5;
margin: 10px auto;
padding: 5px;
}



/**********************
HEADER
**********************/
#header {
position: fixed;
clear: both;
top: 0px;
left: 0px;
width: 100%;
background: #333 url("/img/bg.png") repeat-x;
color: #333;
height: 50px;
margin: 0px;
padding: 0px;
z-index: 2;
}

#top {
position: relative;
width: 510px;
margin: 0 auto;
padding: 0px;
}

.logo {
float: left;
width: 471px;
line-height: 50px;
padding: 0px;
margin: 0px;
}

#header img {
border: none;
padding: 0px;
margin: 0px;
}


/**********************
MAIN COLUMN
**********************/
#main {
float: left;
width: 350px;
height: auto;
margin: 0;
padding: 0;
}

#main img {
max-width: 345px;
padding: 1px;
margin: 0px auto;
margin-top: 5px;
margin-bottom: 5px;
border: 1px solid #999;
}

#main h1 {
font: bold 15px 'arial';
text-transform: uppercase;
color: #000;
margin: 0px;
margin-top: 10px;
padding: 0px;
}

#main h2, h3, h4 {
font: bold 13px 'georgia';
font-style: italic;
text-transform: lowercase;
color: #960081;
padding: 0px;
margin: 10px 0px 0px 0px;
}




/***********************
STAFF
***********************/
.staff {
width: 350px;
height: 110px;
padding: 5px 0px;
margin: 0;
margin-bottom: 10px;
}

.stag {
width: 100px;
float: left;
}

.bio {
width: 240px;
float: right;
display: table;
height: 1%;
/* margin: 0 0 1em; */
}




/***********************
COMMENTS
***********************/
div.bubble {
width: 324px;
font: normal 10px 'arial';
margin-bottom: 24px;
}

div.a {color: #960081; text-transform: capitalize;}
div.a:hover {color: #cee768}

div.bubble blockquote {
margin: 0px;
padding: 0px;
border: 1px solid #f1f1f1;
background-color: #f1f1f1;
}

div.bubble blockquote p {
margin: 10px;
padding: 0px;
}

div.bubble cite {
position: relative;
margin: 0px;
padding: 7px 0px 0px 15px;
top: 6px;
background: transparent url(img/tip.gif) no-repeat 20px 0;
font-style: normal;
}




/***********************
SIDEBAR
***********************/
#side {
float: right;
width: 150px;
height: auto;
margin: 0px;
padding: 0px;
}

#side img {
max-width: 145px;
padding: 5px 0px 5px 0px;
margin: 0px auto;
border: none;
background-color: #fff;
}

#side h1 {
font: bold 13px 'arial';
color: #333;
padding: 0px;
margin: 10px 0px 0px 0px;
}

a.nav {
text-align: left;
text-decoration: none;
text-transform: lowercase;
font: bold 11px 'arial';
color: #333;
background-color: #fff;
border: none;
margin: 0px;
padding: 2px 5px;
display: block;
}

a.nav:hover {
color: #cee768;
}

a.aff {
text-align: center;
font: normal 10px 'arial';
text-transform: capitalize;
color: #000;
background-color: #cee768;
padding: 2px;
margin: 1px;
display: block;
}

a.aff:hover {
background-color: #f6f6f6;
}


#sidebar table, tr, td {
width: 150px;
background-color: #fff;
border: none
}

#sidebar td {
width: 50%;
padding: 0px;
margin: 0px;
}

Reason for edit: Please use [codebox][/codebox] tags when posting long codes. Thanks. - TJ

[coffeeandacasio]

nothing.


it didn't do anything.
should i take out the width:100% ?

Reason for edit: Please use the Edit button instead of double-posting. - Mike

[Mickey]

Posts merged. Try replacing your codes with this:

CODE

/**********************
BIRTHDAY: 14 AUGUST 2009
**********************/
body, html {
margin: 0;
padding: 0;
font: normal 10px 'arial';
color: #000;
background-color: #fff;
text-align: center;
overflow: auto!important;
}

/**********************
LAYOUT
**********************/
#container {
margin: 0 auto;
margin-top: 50px;
margin-bottom: 15px;
padding: 0;
text-align: left;
width: 510px;
z-index: 1;
}

a {
text-decoration: none;
font-weight: normal;
color: #000;
background-color: #f9f9f9;
}

a:hover {
color: #cee768;
}

b {
color: #960081;
}

i {
font-weight: bold;
text-decoration: none;
font-style: normal;
color: #424242;
}

input, textarea {
margin: 2px;
padding: 5px;
background: #fff;
border: 1px solid #e5e5e5;
text-align: left;
font: normal 10px 'arial';
color: #808080;
}
input:focus, textarea:focus {
color: #333;
border: 1px solid #cecece;
}

blockquote {
border: 1px solid #e5e5e5;
margin: 10px auto;
padding: 5px;
}



/**********************
HEADER
**********************/
#header {
position: fixed;
clear: both;
top: 0px;
left: 0px;
width: 100%;
background: #333 url("/img/bg.png") repeat-x;
color: #333;
height: 50px;
margin: 0px;
padding: 0px;
z-index: 2;
}

#top {
position: relative;
width: 510px;
margin: 0 auto;
padding: 0px;
}

.logo {
float: left;
width: 471px;
line-height: 50px;
padding: 0px;
margin: 0px;
}

#header img {
border: none;
padding: 0px;
margin: 0px;
}


/**********************
MAIN COLUMN
**********************/
#main {
float: left;
width: 350px;
height: auto;
margin: 0;
padding: 0;
}

#main img {
max-width: 345px;
padding: 1px;
margin: 0px auto;
margin-top: 5px;
margin-bottom: 5px;
border: 1px solid #999;
}

#main h1 {
font: bold 15px 'arial';
text-transform: uppercase;
color: #000;
margin: 0px;
margin-top: 10px;
padding: 0px;
}

#main h2, h3, h4 {
font: bold 13px 'georgia';
font-style: italic;
text-transform: lowercase;
color: #960081;
padding: 0px;
margin: 10px 0px 0px 0px;
}




/***********************
STAFF
***********************/
.staff {
width: 350px;
height: 110px;
padding: 5px 0px;
margin: 0;
margin-bottom: 10px;
}

.stag {
width: 100px;
float: left;
}

.bio {
width: 240px;
float: right;
display: table;
height: 1%;
/* margin: 0 0 1em; */
}




/***********************
COMMENTS
***********************/
div.bubble {
width: 324px;
font: normal 10px 'arial';
margin-bottom: 24px;
}

div.a {color: #960081; text-transform: capitalize;}
div.a:hover {color: #cee768}

div.bubble blockquote {
margin: 0px;
padding: 0px;
border: 1px solid #f1f1f1;
background-color: #f1f1f1;
}

div.bubble blockquote p {
margin: 10px;
padding: 0px;
}

div.bubble cite {
position: relative;
margin: 0px;
padding: 7px 0px 0px 15px;
top: 6px;
background: transparent url(img/tip.gif) no-repeat 20px 0;
font-style: normal;
}




/***********************
SIDEBAR
***********************/
#side {
float: right;
width: 150px;
height: auto;
margin: 0px;
padding: 0px;
}

#side img {
max-width: 145px;
padding: 5px 0px 5px 0px;
margin: 0px auto;
border: none;
background-color: #fff;
}

#side h1 {
font: bold 13px 'arial';
color: #333;
padding: 0px;
margin: 10px 0px 0px 0px;
}

a.nav {
text-align: left;
text-decoration: none;
text-transform: lowercase;
font: bold 11px 'arial';
color: #333;
background-color: #fff;
border: none;
margin: 0px;
padding: 2px 5px;
display: block;
}

a.nav:hover {
color: #cee768;
}

a.aff {
text-align: center;
font: normal 10px 'arial';
text-transform: capitalize;
color: #000;
background-color: #cee768;
padding: 2px;
margin: 1px;
display: block;
}

a.aff:hover {
background-color: #f6f6f6;
}


#sidebar table, tr, td {
width: 150px;
background-color: #fff;
border: none
}

#sidebar td {
width: 50%;
padding: 0px;
margin: 0px;
}

[fixtatik]

You shouldn't need to use any type of overflow on the body itself. Your problem is because you have two <html> tags. Take out the <html> tag that you have just before <body>

Also, HTML comments use only one exclamation point:

CODE

<!-- comment -->

instead of:

CODE

<!-- comment --!>

[allvanishing]

You or your friend forgot to close the header with a </div> tag. That's the problem.

[coffeeandacasio]

thanks guys :)
we fixed it.

[jiyong]

Topic closed and moved.