Expanding the width of the blog column in Oulipo

f16exhibition · Member · Feb 3, 2012 at 7:18 am
Copy link

Add topic to favorites
The middle main column is too narrow. I have the css upgrade. Is there any possible way to expand the width.

The blog I need help with is: (visible only to logged in users)
raincoaster · Member · Feb 3, 2012 at 7:23 am
Copy link
Yes, there is. In fact, it should be relatively simple. What have you tried so far?
f16exhibition · Member · Feb 3, 2012 at 7:30 am
Copy link
I am not sure where to look in the css text. I have tried messing with the code, and seeing what changes. I am a novice at css and html. I have watched tutorials but I am not sure where to look in the code, or what to change.
thesacredpath · Member · Feb 3, 2012 at 8:38 am
Copy link
How much wider did you want to go? The widths and such are in em units (drived me crazy) so there isn’t a direct correlation to pixels. Right now the content area is about 480px wide.
f16exhibition · Member · Feb 3, 2012 at 3:34 pm
Copy link
hmmm thats confusing. I would like to go double amount the width so around so around 800px or a little more. I want the columns on both sides to push over. Is that possible?
Thanks again for your input :)
designsimply · Member · Feb 3, 2012 at 3:42 pm
Copy link
Here are the relevant widths you’ll want to update from the original Oulipo stylesheet:
```
#wrapper {
width: 60em;
}
#entry-content {
width: 30em;
}
#content {
width: 50em;
}
```
I think increasing each by 20em would work and still looks nice on my laptop. The ems are relative to type size and so they are more fluid than using pixels for sizing.

So try this in your Appearance → Custom Design → CSS page to see how it looks to ya and adjust from there:
```
#wrapper {
width: 80em;
}
#entry-content {
width: 50em;
}
#content {
width: 70em;
}
```
designsimply · Member · Feb 3, 2012 at 3:45 pm
Copy link
Note: to find those widths, I used my browser’s web inspector and clicked around the main blocks of elements until I found the widths and tried adjusting them right from the web inspector. You can also look in the original stylesheet linked on your Appearance → Custom Design → CSS page to find those values.

Web inspectors are awesome. If you haven’t tried them, I’d recommend checking them out. I use Chrome, and it’s built in. There’s an add-on named Firebug for Firefox. And other browsers have web inspectors you can download or enable as well.
f16exhibition · Member · Feb 3, 2012 at 3:51 pm
Copy link
okay so I figured out how to move the menu on the left over. I just need to bring the middle column over to the left
designsimply · Member · Feb 3, 2012 at 3:54 pm
Copy link
Did you try the CSS I posted above?

If you want to use different CSS, please post the CSS you added so far so we can see what you did to move the left menu over.
f16exhibition · Member · Feb 4, 2012 at 7:58 pm
Copy link
Sorry for the delay, I have to retire everything because I messed up the css.
I used the css you posted above/ I made it slightly wider. It looks perfect

No items found.