MainMoose
Member
Posted 3 months ago #
This is confusing. I'm not having any success in my efforts at widening the sidebar on my website. It seems easy enough, and I had no problems adjusting the content width, making sure the margins and entry content width added up to 100%. But for the darn sidebar, I'm just not getting what to do.
What does the width percentage correspond to? If I adjust that width, clearly something else needs to be adjusted, but what? I thought it somehow related to the margin-right on #primary, but no luck.
Here's the website: CLICK HERE
Thanks!
MainMoose
Member
Posted 3 months ago #
I would love some help with this. Thank you!
Try using Firefox with the Firebug add-on for this kind of CSS work.
http://getfirebug.com/
MainMoose
Member
Posted 3 months ago #
I'm using Firebug. Again, per my post, I've tried everything I can think of to do. I don't understand what's controlling the sidebar width. It seems to be relative to something else, but I'm not sure what.
So, can someone please help with this?
Thanks.
MainMoose
Member
Posted 3 months ago #
I'm still needing some assistance with this so that I can finish my mother's website. Thank you.
MainMoose
Member
Posted 3 months ago #
Hello again,
This seems so silly that I can adjust just about everything else with my website, but I can't figure out how to adjust the width of the sidebar. When I try it disappears, which tells me that the percentage width is partnered with something else. But everything I've tried according to common sense isn't working. If Esmi or another experienced participant is reading this, could you please help me out? I want to make the sidebar wider and to narrow the gap between the entry content and the sidebar.
Thank you!!
You cannot widen the sidebar without either decreasing the width of the main content area or increasing the width of the overall page wrapper.
MainMoose
Member
Posted 3 months ago #
Ugh, I've tried that. I'm feeling like an idiot. The width of the page is okay (it was decreased), but when I try to partner the sidebar width with the content area, it doesn't work. What specifically needs to be partnered with the sidebar width percentage? It's currently 21%, but what does mean? Where's the remaining 79%? I can successfully alter the main content area, but nothing seems to allow me to adjust the sidebar. There's plenty of room to make it wider. See that big gap between the left content and the sidebar? How do I do this? Man, shoot me now, please. This is nuts.
MainMoose
Member
Posted 3 months ago #
Here is the solution to this problem:
When you want to adjust the sidebar bar width via the Twenty Eleven theme, you must also adjust the #primary margin-right so that the #secondary margin-right + width adds up to the same amount. Like this:
#primary {
float: left;
margin: 0 -29.5% 0 0;
width: 100%; }
#secondary {
float: right;
margin-right: 4.5%;
width: 25%; }
I'm not sure why the #primary margin must equal all of the #secondary percentages, but they are partnered together. If you don't change the #primary margin-right percentage, your sidebar could disappear.
Thanks.
diafotistiko
Member
Posted 1 month ago #
I adjusted these presentages to my site but I need my sidebar width a little wider. Which presentages should be put?
here is my website http://diafotistiko.gr/
thank you
Mainmoose is right, you basically need to increase/decrease the margins equally. This is for the left sidebar layout, so don't copy/paste it unless thats the layout you're using.
.left-sidebar #primary {
float: right;
margin: 0 0 0 -30.4%; /* increased left margin 4% from -26.4% to -30.4% */
width: 100%;
}
.left-sidebar #content {
margin: 0 7.6% 0 38%; /* increased right margin 4% from 34* to 38% */
width: 58.4%;
}
.left-sidebar #secondary {
float: left;
margin-left: 7.6%;
margin-right: 0;
margin-top: 20px;
width: 22.8%; /* increased sidebar width 4% from 18.8% to 22.8% */
}
I wrote a guide on how to change the sidebar width in Twenty Eleven, I don't like spamming my site, but here it is http://zeaks.org/twenty-eleven-change-sidebar-width/
Make sure to use a child theme.
diafotistiko
Member
Posted 1 month ago #
I need to adjust an ad 300x250
MainMoose -
Take a bow. I struggled and struggled with this until I found your response above.
Zeaks - I apologize - but your tutorial had me pulling out my hair.
Probably because I am new to wordpress. But I did not see any "right" or "left" sidebar anywhere.
Thanks to both of you though. I appreciate all efforts!
Glad you figured it out.
@tg1 Twenty Eleven has 3 layouts, left sidebar, right sidebar and no sidebar.
.left-sidebar and .right-sidebar are the body classes for those two layouts. You don't want the left sidebar layout to use the same CSS as the right sidebar layout, which is why i added the classes.
I probably should of explained that, I'll update my post.
@zeaks - That would be cool. How does one find the "left" sidebar? I have no idea there was a layout like that in Twenty Eleven.
Thanks!
tg1