adlawrence
Member
Posted 5 months ago #
I needed to widen the sidebar on this site: http://scottfishercarpentry.com and when I added this code (in this child theme: http://scottfishercarpentry.com/wp-content/themes/twentytwelvechild/style.css ):
#primary {
float: left;
margin: 0 -33.9% 0 0;
width: 100%;
}
#content {
margin: 0 34% 0 3.9%;
width: 58.4%;
}
#secondary {
float: right;
margin-right: 3.9%;
width: 30%;
}
It widened the sidebar, but also smashed the bottom of the navbar and the top of the text on the page. I've tried changing all of the margins and haven't found the correct one to modify.
Suggestions?
How wide do you want the sidebar?
adlawrence
Member
Posted 5 months ago #
Wide enough to not break the email address, so I went with something that would fit a 300px Google ad.
What do you mean "smashes the bottom of nav bar and the top of the text"?
Why does your primary div have a width of 100%?
adlawrence
Member
Posted 5 months ago #
Thanks for helping me, Andrew.
What do you mean "smashes the bottom of nav bar and the top of the text"?
Here's a screenshot showing what I see: http://s7.postimage.org/cxgmkvxl7/Screen_shot_2012_12_20_at_3_19_05_PM.png
The spacing is too tight between the navbar and title of the page (Home, Porches, and so on).
Why does your primary div have a width of 100%?
If the width is less than 100%, then the main block of text (and any images) doesn't fit in its space.
If you click on this link now, you'll see the primary div with 50% width.
Your smashed appearance is due to your minus margin top values on #primary.
You shouldn't have a width of 100% on your primary div, as you need to have a floating div next to it. You can resolve this, "doesn't fit in its space" issue by removing the width you've applied to #content.
adlawrence
Member
Posted 5 months ago #
I've removed width: 58.4%; from content and it broke the page. Here's how: http://scottfishercarpentry.com
How was that supposed to change the spacing above "Home" and below the navbar?
I've removed width: 58.4%;
Now you can add a proper width other than 100% to #primary.
How was that supposed to change the spacing above "Home" and below the navbar?
That wasn't. I mentioned the minus margin top affects it.
adlawrence
Member
Posted 5 months ago #
Now you can add a proper width other than 100% to #primary.
Ah. I see. Thanks, that's now a more reasonable 64%.
That wasn't. I mentioned the minus margin top affects it.
Ha! I changed that one to 10 and now it's all better. Thank you!
adlawrence
Member
Posted 5 months ago #
This is to close the topic. Thanks again, Andrew.
