Width of Content/Sidebars – How to know proper code

terriblepokerface · Member · Feb 18, 2015 at 6:41 pm
Copy link

Add topic to favorites
I’m trying to play with the width of my content vs sidebar. I was able to successfully move the content over further to the left but cannot figure out how to widen the sidebar. I am working on a much larger screen than what most people have but the text also looks very small in the sidebar so I’d like to know what code to use to play with those sizes.

I have read at least 10 threads in this forum now looking for answers and I’ve found a few helpful things to make revisions but not everything.

My biggest question to anyone out there is: How can I easily find what the proper code is to use for what I am wanting to change? I like figuring things out on my own and don’t want to have to post a topic in here every time I need to change something on my site. I appreciate help but I would love to know some resources that I could use to learn and do all of this myself.

Thank you!

The blog I need help with is: (visible only to logged in users)
staff-happychia · Staff · Feb 19, 2015 at 11:06 am
Copy link
Please add these styles and adjust the percentages:
```
div#primary {
    margin-right: -50.4%;  /* Originally  -26.4% */
}

#secondary {
width: 30%; /* Originally 23%*/
}
```
These are some good starter level CSS docs:

http://dailypost.wordpress.com/2013/06/21/css-intro/
http://dailypost.wordpress.com/2013/07/25/css-selectors/
http://dailypost.wordpress.com/2013/08/29/css-matched-rule-pane/

http://en.support.wordpress.com/custom-design/css-basics/
http://en.support.wordpress.com/custom-design/editing-css/
moniquelain · Member · Feb 19, 2015 at 11:35 am
Copy link
Hello :) Like the above question I have the same issue. I would like to make my posting/content space bigger (broader) but I have NO idea how and I am not a tech in any way shape or form. My blog has the custom design upgrade and it’s my understanding that I’ll need “code” to do this but I don’t even know where to begin. Please help; Monique Lain
terriblepokerface · Member · Feb 19, 2015 at 4:20 pm
Copy link
Thank you, that helped!

Is it possible to change the font size for the recent posts/categories widgets? I also don’t like how they are not aligned with the other widgets because of the bullet points. Same with archives. Can you tell me how I can fix the alignment and font size?
staff-happychia · Staff · Feb 20, 2015 at 9:05 am
Copy link
@terriblepokerface

13px is the current font size. Please change it as needed.
```
.widget a {
font-size: 13px;
}
```
How do you want the alignment of bullets to be?
staff-happychia · Staff · Feb 20, 2015 at 9:06 am
Copy link
@moniquelain

Could you confirm that you need help with https://fiftyshadesofgreyandmore.wordpress.com/
moniquelain · Member · Feb 21, 2015 at 5:02 am
Copy link
Yes, that’s the one. Thank you.
moniquelain · Member · Mar 8, 2015 at 5:40 am
Copy link
Hello again :) Is there any follow on info on my query?
staff-happychia · Staff · Mar 8, 2015 at 8:15 am
Copy link
Sorry, I tried but I could not figure how to increase the width.
thesacredpath · Member · Mar 10, 2015 at 7:42 pm
Copy link
Hi @moniquelain, give the following a try. It increases the overall width, and the content width of your site by 200px.

Go to Appearance > Customize > CSS, delete all the informational text in that window, and paste in the following custom CSS.
```
#page {
    width: 1178px;
}
#branding hgroup {
    margin-left: 590px;
}
#main, #header-image {
    width: 1070px;
    height: 296px;
}
.entry-content, .entry-summary {
    width: 674px;
}
#content {
    background-color: #fff;
}
#header-image img {
    height: 296px;
    width: 1070px;
}
```
Also in the Media Width field below the CSS editing area, enter 674.

No items found.