What is my items overlapping


May I know why is my items overlappy?(The header and menu)
How do I put the ''slider'' beside my twitter timeline?
I also want to know how to position all my items properly at the center with 20% space at the left and right.
Here are my css

@charset "utf-8";
/* Layout */
form, fieldset{border:0;margin:0;padding:0}
.user_layout{width:960px;margin:0 auto}
.gnb ul{float:left;background:#A9F7F3;
font-family: Arial;
color: #000000;
font-size: 28px;
padding: 10px 20px 10px 20px;
text-decoration: none;}
.gnb li{display: inline;width: 80px;}
.body{margin:20px 0;zoom:1;background:#eee}
.twitter-timeline{float:left;width: 30%;background:#ddd}
.photoslider{float:right; width: 63%;background:#ddd;}


Seems you have two post, this one and this one. Please remove one of the two, i will help you in a moment