Content area too wide
-
Hi all,
I’ve been working away at this theme, but can’t seem to get the content area to display quite right …
If you look at where they want the top navigation placed, you’ll notice that the white background below it, is much too wide on either side of the theme and looks silly.
I also can’t seem to lessen the distance between the content and sidebar …
I’ve validated, and am still getting errors – but it’s in regards to the ‘featured gallery’ mark-up. (Which I’ll activate later.)
Any suggestions would be greatly appreciated ~`
Thanks,
JenniferSorry for the long and messy css(things need to be removed is all)!
/*body*/ body { margin:0 auto; padding:0px 0 0px 0; background:#909eaf url(images/bg.jpg) top repeat-x; font-family:Century gothic, Arial,Tahoma,sans-serif; color:#43475a; font-size:13px; } #main { width:1014px; margin:0 auto; background-color:#ffffff; } #header { background:transparent; height:151px; position:relative; } #logo { position:relative; padding:22px 0px 0px 0px; height:60px; } #logo .description{ position:absolute; left:15px; bottom:3px; color:#ffffff; text-indent:-10000px; } .slider{ padding:8px ; background:#7b8ab0; margin-top: 10px; border:1px solid #000000; border-radius:5px; -moz-border-radius:5px; -webkit-border-radius:5px; } .box{ margin: 10px 0px 0px 0px; padding:5px 5px 5px 5px; background: url(images/box.jpg); height: 60px; } #top { height:152px; margin:auto; background:#393c42 url(images/header.jpg) top repeat-x; width:1014px; } .bloglinks { font-family:Arial,Verdana,Tahoma,sans-serif; font-size:11px; padding:8px 0 8px 0px; margin-left:20px; float:left; background-repeat:no-repeat; } .bloglinks a { font-color:Arial,Verdana,Tahoma,sans-serif; margin-right:20px; float:left; background-repeat:no-repeat; } .bloglinks a:hover { color: #43475a; background-color: transparent; } #foxmenucontainer{ height:38px; background:url(images/navback.jpg) repeat-x; display:block; padding:5px 0 0px 0px; border-bottom:4px solid #fff; font: 11px "Century gothic",verdana, Arial, sans-serif; font-weight:normal; } /* Breadcrumb */ #breadcrumb{ height:15px; display:block; color:#3b3b3b; font:bold 10px verdana, Arial, sans-serif;font-weight:normal; padding:8px 0px 0px 10px; text-transform:uppercase; } #breadcrumb a, #breadcrumb a:visited { color: #3d9008; font-weight: bold; margin: 0px; } #breadcrumb a:hover{ color: #3d9008; font-weight: bold; text-decoration: underline; } #headerad{ margin: 0px ; right: 20px; float: right; position: absolute; top:30px; border:1px solid #adacac; } /*menu*/ #menubar{ height:36px; background: #122301; display:block; padding:0px 0 0px 0px; font: 12px Tahoma,Century gothic,verdana, Arial, sans-serif; font-weight:normal; text-transform:uppercase; } .lavaLampNoImage { position: relative; width: 960px; padding: 5px 10px; margin: 0px 0px 0px 0px; overflow: hidden; } .lavaLampNoImage li { float: left; list-style: none; margin:0px 0px; padding:0px 0px; } .lavaLampNoImage li.back { width: 5px; height: 20px; border:1px solid #7b8ab0; border-radius:5px; -moz-border-radius:5px; -webkit-border-radius:5px; top:7px; z-index: 8; position: absolute; } .lavaLampNoImage li a:visited , .lavaLampNoImage li a:link{ font: 12px Trebuchet ms,Century gothic, Arial, Tahoma, sans seriff ; text-decoration: none; color:#071526; outline: none; text-align: center; top: 3px; letter-spacing: 0; z-index: 10; display: block; float: left; height: 20px; position: relative; overflow: hidden; margin: auto 10px; } .lavaLampNoImage li a:hover, .lavaLampNoImage li a:active { border: none; color: #071526; } /* Category menu*/ #catmenu{ height:38px; background:url(images/menubar.jpg) no-repeat left; display:block; padding:0px 0 0px 0px; font: 13px verdana,Century gothic,Tahoma, Arial, sans-serif; font-weight:normal; } #menu{ margin: 0px 0px 0px 1px; padding: 0px; width:1000px; height:38px; } #menu ul { float: left; list-style: none; margin: 0px; padding: 0px; } #menu li { float: left; list-style: none; margin: 0px; padding: 0px; } #menu li a, #menu li a:link, #menu li a:visited { color: #333333; display: block; text-align:center; width:98px; background:url(images/menubar.jpg) no-repeat right; margin: 0px; padding: 11px 10px 11px 10px; } #menu li a:hover, #menu li a:active { background:url(images/menua.png) repeat-x; text-align:center; width:98px; background:#fff url(images/menubar.jpg) no-repeat right; margin: 0px; padding: 11px 10px 11px 10px; } #menu li li a, #menu li li a:link, #menu li li a:visited { background: url(images/black.png); width: 120px; color: #fff; font-size: 13px; font-family: tahoma, century gothic,Georgia, sans-serif; font-weight: normal; float: none; margin: 0px; padding: 10px 10px 10px 10px; border-bottom: 1px solid #30302f; border-left: 1px solid #30302f; border-right: 1px solid #30302f; } #menu li li a:hover, #menu li li a:active { background: url(images/black.png); color: #fff; width: 120px; padding: 10px 10px 10px 10px; } #menu li ul { z-index: 9999; position: absolute; left: -999em; height: auto; width: 156px; margin: 0px; padding: 0px; } #menu li li { } #menu li ul a { width: 140px; } #menu li ul a:hover, #menu li ul a:active { } #menu li ul ul { margin: -37px 0 0 142px; } #menu li:hover ul ul, #menu li:hover ul ul ul, #menu li.sfhover ul ul, #menu li.sfhover ul ul ul { left: -999em; } #menu li:hover ul, #menu li li:hover ul, #menu li li li:hover ul, #menu li.sfhover ul, #menu li li.sfhover ul, #menu li li li.sfhover ul { left: auto; } #menu li:hover, #menu li.sfhover { position: static; } /*headings*/ h1 { text-indent:-10000px; margin:0; padding:0; } h1 a{ display:block; background:url(images/logo.jpg) no-repeat left; height:72px; border: none; } h1 a:hover{ color: #000000; text-decoration:none; } h2 { color: #007ab6; margin: 0px 0px 0px; border-bottom:none; font: 20px Georgia,century gothic,Arial,verdana, sans-serif; padding:0px 0px 0px 0px; font-weight:bold; overflow:hidden; } h2 a, h2 a:visited { color: #32394c; text-decoration: none; } h2 a:hover { color: #32394c; text-decoration: none; } h3 { color: #111; margin: 0px 0px 2px; letter-spacing: -1px; font: 16px Georgia,century gothic,Arial,verdana, sans-serif; padding:0px 0px 3px 0px; font-weight:bold; } h4 { color: #444; margin: 0px 0px 2px; letter-spacing: -1px; font: 14px Georgia,century gothic,Arial,verdana, sans-serif; padding:0px 0px 3px 0px; font-weight:bold; } /*content*/ #casing { padding:0px 0px 10px 0px; background:#e5e7db bottom right; background-repeat:no-repeat; } #content { padding: 0px 0px 30px 5px; float: left; width: 650px;background:#ffffff bottom right; overflow: hidden; line-height: 16px; text-align: justify; font: 10pt verdana, arial, helvetica, sans-serif; color: #333333; } .post { clear:both; margin: 15px 0px 10px 0px; background:#fff ; border: 1px solid #cccccc; border-radius:5px; -moz-border-radius:5px; -webkit-border-radius:5px; } .title { float:left; margin:0px 0px 0px 0px; width:650px; height:25px; padding:5px 0px 0px 5px; } .cover{ margin: 0 0; } .date { font-size:10px; font-family:Tahoma, century gothic,Arial,Verdana,Helvitica,sans-serif; padding:0px 5px; color:#555; text-transform: uppercase; } .comm{ padding:0px 10px 0px 10px; position:relative; } .comm a:link, .comm a:visited { color:#339dd2; } .comm a:hover{ color:#f1a218; } .clock{ color:#555; padding:0px 0 0px 5px; } .entry { clear:both; margin: 5px; padding: 5px 10px; color:#42423d; font: 12px verdana, century gothic,Arial,verdana, ; height:100%; background:#fff; } .entry p{ margin:5px 5px; padding:0px 0px; line-height:20px; color:#42423d; font: 12px verdana, century gothic,Arial,verdana, ; height:100%; background:#fff; text-align: justify; } .entry img{padding: 5px 5px; margin: 5px 5px 5px 5px; float:left; background:#dedcdd; border: 1px solid #CACFA8; border-radius:5px; -moz-border-radius:5px; -webkit-border-radius:5px; } .entry a:link, .entry a:visited { color:#2a53b0; } .entry a:hover{ color:#2a53b0; } .comments { font-size:10px; font-family:Tahoma, century gothic,Arial,Verdana,Helvitica,sans-serif; float: left; margin: 0px 0px 10px 0px; padding: 5px 0px 5px 15px; color: #3994d2; width: 635px; text-transform: uppercase } .comments a:link, .comments a:visited { color:#3994d2; } .comments a:hover{ color:#3994d2; } .navigation { clear: both; padding: 10px 0px; } .navigation a, .navigation a:visited { color: #bc3792; } .previous-entries a { float: left; padding-left: 12pt; } .next-entries a { float: right; padding-right: 18pt; } .ad1{ text-align:center; width:635px; margin: 5px 5px 5px 0px; padding:5px 6px; background:#fff; border:1px solid #ccc; border-radius:5px; -moz-border-radius:5px; -webkit-border-radius:5px; } /* sidebar */ #rightcol{ float: right; width:250px; padding:0px 10px 10px 0; } .video{ width:230px; float:right; padding:10px 9px 10px 8px; height:240px; margin:5px 2px 5px 0px; background:#fff ; position:relative; border:1px solid #cccccc; overflow: hidden; overflow: hidden; border-radius:5px; -moz-border-radius:5px; -webkit-border-radius:5px; } .about { float:right; width:230px; margin:5px 0px 5px 0px; padding:10px; background:#fff; display:inline; color:#F3F6FB; font: 13px Tahoma,century gothic,Verdana, sans-serif; border:1px solid #ccc; border-radius:5px; -moz-border-radius:5px; -webkit-border-radius:5px; } .about img { padding:0px; } .about p { font: 11px verdana,century gothic,Georgia,Verdana, sans-serif; margin:0px 9px 0px 9px; color:#28344e; line-height:20px; } img.myphoto { padding: 5px; } .bannerbox{ width:318px; float:right; height:305px; padding:0px 5px 5px 3px; margin:5px 2px 5px 1px; background:#fff ; border:1px solid #cccccc; position:relative; overflow: hidden; border-radius:5px; -moz-border-radius:5px; -webkit-border-radius:5px; } .bannerbox a:link, .bannerbox a:visited { color:#0282D9; } .bannerbox a:hover{ color:#BC0C0F; } .banner{ margin: 5px 0 0 0; padding: 0px 0 0 0px; width:335px; float:left; height:100%; } .banner ul { margin: 0px 0px; padding: 0px 0px; overflow: auto; } .banner li{ width:127px; margin: 5px 8px 0px 8px ; padding:8px 9px ; list-style:none; display : block; overflow:hidden; float:left; background:#122301; } .banner li a:link, .banner li a:visited { text-decoration: none; } .sidebarad{ width:300px; float:left; height:100%; padding:5px 15px; margin:5px 0px 0px 0px; background:#fff ; border:1px solid #BCBCBC; border-radius:5px; -moz-border-radius:5px; -webkit-border-radius:5px; } /* Sidebar1 */ .sidebar1{ float:left; width:160px; padding:0px 0px 0px 0px; font-size:12px; font-family:Tahoma,Georgia,Century gothic, Arial, sans-serif; margin-top: 5px; } .sidebar1 h2 { line-height:24px; font-size:16px; color:#fff; margin:5px 0 0px 0 ; padding:0px 0 2px 5px; font-weight:normal; font-family:Georgia,Century gothic, Arial, sans-serif; background:#598a16; } .sidebar1 ul { list-style-type: none; margin: 0 ; padding: 0; } .sidebar1 ul ul { list-style-type: none; margin: 0; padding: 0px 0px 10px 0px; background-repeat:no-repeat; } .sidebar1 ul ul ul { list-style-type: none; margin: 0; padding: 0; border:0 } .sidebar1 ul ul ul ul { list-style-type: none; margin: 0; padding:0; border:0; } .sidebar1 ul li { height:100%; line-height:18px; float: left; clear: left; width: 158px; } .sidebar1 ul li a:link, .sidebar1 ul li a:visited { background:#fff; color:#171f01; border-bottom:1px solid #EBEFD1; text-decoration: none; padding: 5px 0px 5px 5px; display:block; } .sidebar1 ul li a:hover { background:#fff; color: #777; } .sidebar1 p { padding: 7px 10px; margin:0; } .sidebar1 table { width:100%; text-align:center; color:#787d7f; } /*Sidebar2 */ .sidebar2{ float:right; width:160px; padding:1px 1px 0px 1px; font-size:12px; font-family:Tahoma,Georgia,Century gothic, Arial, sans-serif; margin-top: 5px; } .sidebar2 h2 { line-height:24px; font-size:14px; color:#fff; margin:5px 0 0px 0 ; padding:0px 0 2px 5px; font-weight:normal; font-family:Georgia,Century gothic, Arial, sans-serif; background:#598a16; } .sidebar2 ul { list-style-type: none; margin: 0 ; padding: 0; } .sidebar2 ul ul { list-style-type: none; margin: 0; padding: 0px 0px 10px 0px; background-repeat:no-repeat; } .sidebar2 ul ul ul { list-style-type: none; margin: 0; padding: 0; border:0; } .sidebar2 ul ul ul ul { list-style-type: none; margin: 0; padding: 0; border:0; } .sidebar2 ul li { height:100%; line-height:18px; float: left; clear: left; width: 158px; } .sidebar2 ul li a:link, .sidebar2 ul li a:visited { background:#fff; color:#171f01; border-bottom:1px solid #EBEFD1; text-decoration: none; padding: 5px 0px 5px 5px; display:block; } .sidebar2 ul li a:hover { background:#fff; color: #777; } .sidebar2 p { padding: 7px 10px; margin:0; } .sidebar2 table { width:100%; text-align:center; color:#787d7f; } /*comments*/ #comments, #respond { padding: 10px 0 5px 10px; clear: both; } .cleft { float:left; width:60px; border:3px double #dadada; margin:0px 10px 10px 0px; } .commentlist { margin: 10px 0px; padding: 20px; } .commentlist li{ padding: 5px 10px; border-bottom:1px solid #dedede; } .commentlist cite { font-size: 14px; color: #000; font-weight:bold; } .commentlist cite a, .commentlist cite a:visited { color: #000; font-weight:bold; } .commentlist small { margin-bottom: 5px; display: block; font-size: 87%; } #commentform { margin-top: 10px; font: 10px; } #commentform p { padding: 6px 10px; margin: 0px; } #commentform label{ color: #555; font-size: 77%; } #commentform input{ width: 200px; background:#ffffff; border: 1px solid #999; padding: 3px; margin-top: 3px; border-radius:5px; -moz-border-radius:5px; -webkit-border-radius:5px; } #commentform textarea{ width: 570px; height: 115px; background:#ffffff; border: 1px solid #999; padding: 2px; margin-top: 3px; border-radius:5px; -moz-border-radius:5px; -webkit-border-radius:5px; } #commentform textarea:focus, #commentform input[type="text"]:focus { background: #ffffff; } #commentform #submit{ background:#263554; font: 14px ; color: #fff; border:1px solid #5c790c; float:left; width: 130px; height: 28px; cursor: pointer; border-radius:5px; -moz-border-radius:5px; -webkit-border-radius:5px; } /* The Search */ #search { height:23px; width:auto; padding:0px 0px 0px 0px; padding-left:50px; width:225px; float:left; } #search form { margin: 0; padding: 0; } #search fieldset { margin: 0; padding: 0; border: none; } #search p { margin: 0; font-size: 85%; } #s { margin-left:0px; float: left; width:120px; padding: 0px 2px 6px 15px; background:#fff url(images/sform.jpg) no-repeat; border:none; font: normal 100% "century Gothic", Arial, Helvetica, sans-serif; color:#fff; } #searchsubmit { width:29px; float: left; background:transparent url(images/go.png); border:none; font: bold 100% "century gothic", Arial, Helvetica, sans-serif; color: #FFFFFF; height:23px; margin-right:5px; } /*footer*/ /* --- FOOTER --- */ #footer { height:40px; padding:5px 0 0 10px; color:#999; font-size:12px; font-weight:normal; text-align:center; letter-spacing:1px; font-family: Century gothic, georgia, Arial, sans-serif; } #footer a:link , #footer a:visited{ color:#E8EBEE; } #footer a:hover { color:#fff; } /*Other*/ .center { text-align: center; } a,a:visited { color: #2a53b0; text-decoration: none; } a:hover { color: #2a53b0; text-decoration: none; } img { border: none; } form { margin:0px; padding:0px; } p { padding: 0px 0px 15px; margin: 0px; } img.center, img[align="center"] { display: block; margin-left: auto; margin-right: auto; } .alignleft { float: left; } img.alignleft, img[align="left"] { float:left; margin: 2px 10px 5px 0px; } .alignright { float: right; } img.alignright, img[align="right"] { float:right; margin: 2px 0px 5px 10px; } .clear { clear:both; } hr.clear { clear:both; visibility: hidden; margin: 0px; padding: 0px; } /* Fix floats */ img { border: none; } form { margin:0px; padding:0px; } p { padding: 0px 0px 15px; margin: 0px; } img.center, img[align="center"] { display: block; margin-left: auto; margin-right: auto; } .alignleft { float: left; } img.alignleft, img[align="left"] { float:left; margin: 2px 10px 5px 0px; } .alignright { float: right;} img.alignright, img[align="right"] { float:right; margin: 2px 0px 5px 10px; } .clear { clear:both; } hr.clear { clear:both; visibility: hidden; margin: 0px; padding: 0px; } .aligncenter { display: block; margin-left: auto; margin-right: auto; } .alignleft { float: left; } .alignright { float: right; } /* image caption */ .wp-caption { border: 1px solid #ddd; text-align: center; background-color: #f3f3f3; padding-top: 4px; margin: 10px; -moz-border-radius: 3px; -khtml-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; } .wp-caption img { margin: 0; padding: 0; border: 0 none; } .wp-caption-dd { font-size: 11px; line-height: 17px; padding: 0 4px 5px; margin: 0; } .feed input { border:2px solid #ccc; } .feed button { border: 2px solid #ccc; } #bhalf { height:99px; background:#393c42 url(images/bottom.jpg) top no-repeat; width:360px; position: relative; top: -10px; right: 100px; }
Viewing 1 replies (of 1 total)
Viewing 1 replies (of 1 total)
- The topic ‘Content area too wide’ is closed to new replies.