| Farrhad A |
06-17-2009 10:41 AM |
My forum is too wide- PLEASE help!
1 Attachment(s)
Hi,
My forum is too wide.
Please help me fix it right.
Here is the code:
Code:
/* *** required *** */
.nopad, .nopad * {
padding: 0;
margin: 0;
}
.clear { clear: both; }
.container {
margin: 0 auto;
width: 900px;
padding: 0px 25px 0px 100px;
}
/* *** header *** */
#header {
background: url(images/webmasterpeers/header/bg.gif) repeat-x top left #355052;
}
#header .container {
background: url(images/webmasterpeers/header/header.jpg) no-repeat top left;
width: 1000px;
position: relative;
height: 88px;
padding: 0px;
}
/* *** logo *** */
#header h1 {
height: 88px;
float: left;
margin-left: 75px;
width: 238px;
}
#header h1 a {
display: block;
height: 88px;
text-indent: -9999px;
outline: none;
}
/* *** nav *** */
#header ul {
background: #50959a;
border-top: 1px solid #314a4b;
position: absolute; bottom: 0; right: 100px;
width: 621px;
}
#header li {
display: inline;
list-style: none outside;
}
#header li a {
border-top: 1px solid #79c2c7;
border-left: 1px solid #386b73;
border-right: 1px solid #65b2b7;
color: #FFF;
font: bold 14px/40px arial;
display: block;
height: 40px;
float: left;
text-align: center;
}
#header li a:hover {
background: url(images/webmasterpeers/header/rollover.gif) repeat-x top left #c9d8e7;
border-right-color: #bbc8d4;
border-top-color: #b8c5d1;
color: #5c6875;
text-decoration: none;
}
#header li#nav1 a {
border-left: 0;
width: 67px;
}
#header li#nav2 a {
width: 80px;
}
#header li#nav3 a {
width: 108px;
}
#header li#nav4 a {
width: 55px;
}
#header li#nav5 a {
width: 63px;
}
#header li#nav6 a {
width: 71px;
}
#header li#nav7 a {
width: 57px;
}
#header li#nav8 a {
background: url(images/webmasterpeers/header/register_now.gif) no-repeat center center #3e747a;
width: 156px;
padding: 0;
border-right: 0;
text-indent: -9999px;
}
#header li#nav9 a {
width: 156px;
border-right: 0;
}
/* *** header lower *** */
#header_lower {
background: url(images/webmasterpeers/header/lower_bg.gif) repeat-x bottom left #ceddec;
border-bottom: 1px solid #ecf6ff;
min-height: 187px;
}
* html #header_lower {
height: 187px;
}
.logo {
background: url(images/webmasterpeers/header/logo_under.gif) no-repeat top center;
display: block;
float: left;
height: 60px;
width: 214px;
}
#member_box {
clear: left;
float: left;
margin-top: 11px;
width: 211px;
}
#member_box p { margin: 0; }
#member_box input { vertical-align: middle; }
#member_box div {
border-top: 1px solid #9facba;
border-left: 1px solid #acbac9;
border-right: 1px solid #acbac9;
border-bottom: 1px solid #b4c2d2;
font-size: 10px;
padding: 9px;
background: url(images/webmasterpeers/header/login_bg.gif) repeat-x top left #b8c7d7;
}
.loginput {
padding: 2px 8px;
width: 74px;
margin: 0 2px;
margin-bottom: 6px;
height: 14px;
font-size: 10px;
border: 0;
background: url(images/webmasterpeers/header/login_input.gif) no-repeat center right;
color: #5f666e;
}
.loginGo {
border: 0;
background: url(images/webmasterpeers/header/login_go.gif) no-repeat center center #5ca0a6;
width: 211px;
height: 36px;
}
#guest_message {
background: url(images/webmasterpeers/header/msg_top.gif) no-repeat top center #FFF;
float: right;
position: relative;
margin-top: 5px;
margin-right: -5px;
width: 681px;
}
#guest_message #inner {
background: url(images/webmasterpeers/header/msg_bottom.gif) no-repeat bottom center;
padding: 25px 20px;
}
#guest_message p {
color: #66857d;
margin: 0;
line-height: 150%;
}
#foursixeight {
float: right;
margin-bottom: 12px;
margin-top: 7px;
text-align: center;
width: 681px;
}
/* *** content *** */
#main_content {
border-top: 4px solid #ddeef6;
padding: 30px 0;
}
/* *** footer *** */
#footer {
background: url(images/webmasterpeers/footer/bg.gif) repeat-x top left #9ba4ae;
}
#footer .container {
background: url(images/webmasterpeers/footer/copyright.jpg) no-repeat top left;
width: 1100px;
padding-top: 85px;
padding-bottom: 20px;
}
#footer p {
color: #FFF;
margin: 0;
margin-left: 100px;
margin-bottom: 5px;
}
#footer p a { color: #26272a; font-weight: bold; }
/* *** misc *** */
.tcat_icon { margin-right: 6px; }
.count {
color: #2b4041;
font-weight: bold;
}
/* *** postbit *** */
.posttitle {
margin-bottom: 10px;
padding-bottom: 10px;
border-bottom: 1px solid #afb2b7;
font-size: 13px;
color: #3e5a5d;
}
#postbit_top, #postbit_bottom {
display: block;
height: 4px;
width: 196px;
margin: 0 auto;
}
#postbit_top {
background: url(images/webmasterpeers/postbit/postbit_top.gif) no-repeat bottom center;
}
#postbit_bottom {
background: url(images/webmasterpeers/postbit/postbit_bottom.gif) no-repeat top center;
}
#postbit {
background: url(images/webmasterpeers/postbit/postbit.gif) no-repeat top center;
color: #f4f2f5;
width: 172px;
padding: 9px 12px;
text-align: center;
}
#postbit a {
color: #3d5b5d;
}
.userinfo {
border: 1px solid #36393e;
border-width: 0 1px;
text-align: left;
padding: 5px 8px;
margin-bottom: 6px;
background: url(images/webmasterpeers/postbit/userinfo.gif) repeat-x top left;
}
.post_top_cell {
background: url(images/webmasterpeers/postbit/gradient_top.gif) repeat-x top left #d7dce2;
}
.post_bottom_cell {
background: url(images/webmasterpeers/postbit/gradient_bottom.gif) repeat-x bottom left #d7dce2;
border-bottom: 1px solid #FFF;
}
.msg {
color: #3d4248;
line-height: 150%;
}
I have attached a screenshot.
Here is the link: www.webmasterpeers.com
Thanks!
EDIT: Or can someone tell me how to make the top layer of the header fixed width. |
More Information