Posted 2 years ago #
Hi. In the widgets section when you're editing your WP site, there's an option to add a "Bottom Content Widget". The widget only goes across half of the main section on my website. You can see what I'm talking about HERE (http://techgeec.com/wp-content/uploads/2009/12/content-half.png). I want to know if it's possible to stretch it horizontally so that it looks like THIS (http://techgeec.com/wp-content/uploads/2009/12/content-full.png).
All help is appreciated!
Posted 2 years ago #
css problem, install firebug for firefox, right-click, inspect element and play with width, margins and padding.
Posted 2 years ago #
Thanks, @gerbilk, I'll try that now.
Posted 2 years ago #
From what I'm seeing, I can't find anyway to change it. Here's what I got from firebug:
<div id="bottom-content-1">
<ul class="clearfix xoxo">
<li class="widgetcontainer clearfix">
<h5 class="widgettitle">Case Crown</h5>
<div class="widgetcontent">
<div class="textwidget">
<a href="http://techgeec.com/wp-content/uploads/2009/12/CaseCrown.gif">
<img class="aligncenter size-full wp-image-702" width="634" height="256" alt="CaseCrown" src="http://techgeec.com/wp-content/uploads/2009/12/CaseCrown.gif" title="CaseCrown"/>
</a>
</div>
</div>
</li>
</ul>
</div>From what you see, is there any way to change it?
Posted 2 years ago #
That's the html, you need to change the corresponding CSS which is in the box on the right in firbug, under the style tab, will look something like
.textwidget{
width:400px;
margin:20px;
}look here for an introduction http://www.w3schools.com/css/
Posted 2 years ago #
I really appreciate all of your help so far but i can't seem to find the code that you've provided. Here's all of the CSS that Firebug as found: http://techgeec.com/css
Posted 2 years ago #
The link above is just a link to a post on my website displaying all of the CSS code.
Posted 2 years ago #
can you provide a link to a live page with the error?
Posted 2 years ago #
Here ya go: http://techgeec.com/. Thanks again so much for all of your help.
Posted 2 years ago #
hi in your theme's folder look for default.css (in css/styles) and on line 147 change
#bottom-content-1, #bottom-content-2 {
float:left;
margin:0 10px 10px 0;
overflow:hidden;
width:320px;
}#bottom-content-1, #bottom-content-2 {
float:left;
margin:0 10px 10px 0;
overflow:hidden;
}if this doesn't work as it should on every browser separate content 1 from content 2 (copy and paste so there are two) and set each at a different width.
Posted 2 years ago #
It worked! Thank you so much for all of your help, I really appreciate it. Thanks again!
Posted 2 years ago #
no worries :)
This topic has been closed to new replies.
