Help with Morefoot Background!?

[jennajonesdesign+ 15]

Hey Guys, I just finished this site and have it almost exactly how I want it....EXCEPT... I cannot get the Morefoot background to be the same width as the white content area above it. (Notice the annoying margin on the right.) I do have firebug and have tried all kinds of CSS, but can't figure out that little detail. On a secondary note can if anyone can tell me how to increase the text size in MoreFoot middle widget that would also be hugely appreciated. Here is the link: http://www.caripikephotography.com/ Thanks!!

[catrina 103]

What's your current custom CSS? Add this code for middle widget font size: [code]div$events-widget-2 div.events.widget.fix p {font-size: 16px;}[/code]

[jennajonesdesign+ 15]

Hey Catrina, Thanks so much for your response. Tried the above code - didn't work. Here is what I currently have: body{} #cred {display:none;} .fpost {border:0} .tags {display:none;} .event-meta{display:none;} #footer .widget-title { border-bottom: 1px solid #000000; font-size: 16px; margin-bottom: 0.6em; padding-left: 0; } div.srp-widget-singlepost { border-bottom: 1px solid #000000; margin: 0 0 10px; padding: 0 0 10px; } .dcol_container_3 { float: middle; margin-left: 10px; background: url(http://www.caripikephotography.com/wp-content/uploads/2012/05/soft_light.jpg); } #page-canvas { border-style:solid !important; border-width:0px !important; border-color:#4a0422 !important; background: white; } .slideshow-content img { border-style:solid !important; border-width:2px !important; border-color:#535353 !important; margin: 0 !important; max-width: none !important; padding: 0 !important; } .fpost .post-excerpt, .fpost .entry_content { border-left: opx solid #dcdacd; } .canvas #page-canvas { margin-top: 30px; margin-bottom: -50px; vertical-align: middle !important;} .one-sidebar-right #column-main .mcolumn-pad{ padding-top: 15px; padding-left: 6px; padding-right: 10px; padding-bottom:0px; margin-bottom:0px; } .scolumn-pad { padding-top: 0px; padding-left:15px; padding-right:5px; border-left: 10px solid #cc8dfe } #column-main { background:none margin-top:0px; margin-bottom: 0px; margin-left:0px; padding-left:0px; border-right: 10px solid #cc8dfe } #sidebar-wrap { background:none margin-top:0px; margin-bottom: 0px; padding-top:0px; height:100%; } body #page #page-canvas{background:none margin:10px;} body #page{background: none} #page-main{ background: } li.widget { border-bottom: 1px solid #000000; margin-bottom: 0px; padding-top: 10px; text-align: center; } #sidebar_primary {padding-top:0px;} ul.sidebar_widgets {text-align:center;} .post-title h2 a{font-size:18px;} .post-title h1, h3 a{font-size:26px;} .widget ul {align:center;} .widget ul li a:hover { text-decoration: none; font-weight:bold; font-size: } .post-title h1, h3 a { font-size: 17px; } .event_title { font-size: 19px !important; } p{font-size:14px; line-height:18px;} h1{font-size:17px;) h2{font-size:17px;) h3{font-size:17px;)

[Danny+ 1,327]

Hi, The issue isn't actually your morefoot, its with this CSS that is in your dynamic css [code]body #page #page-canvas { background: none margin:10px; } #page-main { background: :; }[/code] Also, you Morefoot area has a width of 1132px, but your page width is 1152px, as you can see from the below code. Therefore, you have two options change the width of your morefoot area to match your page width or reduce the width of your page to the same dimensions as your morefoot. [code].fixed_width #page, .fixed_width #footer, .canvas #page-canvas { width: 1152px; }[/code] From the looks of it, your Morefoot width is set via the CSS below. [code]#site .content, .wcontent, #primary-nav ul.main-nav.nosearch { width: 1132px; }[/code]

[jennajonesdesign+ 15]

Danny!!! THANK YOU! THANK YOU! THANK YOU! It worked. I really appreciate you muddling through my css and finding the solution. I hugely appreciate it!! Jenna