Changing width of columns in three column page template

misspuppydoc · Member · Nov 10, 2016 at 6:08 am
Copy link

Add topic to favorites
Hello. I am currently using the Natural theme, and for my about pages I am using the three-column format. How can I increase the width of the middle column by either changing the width of the widgets or by expanding overall width of the page?

Thanks!

The blog I need help with is: (visible only to logged in users)
misspuppydoc · Member · Nov 11, 2016 at 10:39 pm
Copy link
I’m sad no one is helping me…
thesacredpath · Member · Nov 12, 2016 at 3:27 pm
Copy link
Hi, the main container on your site is 1120px wide less 48px of padding on the left and right, so I would generally thing that is a pretty good overall width. The following CSS takes width away from the sidebars on pages using the 3-column layout and adds it to the main content column. Add the following to the end of your custom CSS and see what you think.
```
.page-template-template-three-column .row .four {
    width: 18.75%;
}
.page-template-template-three-column .row .five {
    width: 25%;
}
.page-template-template-three-column .row .seven {
    width: 56.25%;
}
```
misspuppydoc · Member · Nov 12, 2016 at 3:45 pm
Copy link
I’m playing around with the percentages a little, but this is exactly what I needed.

Thank you!
thesacredpath · Member · Nov 12, 2016 at 3:46 pm
Copy link
You are welcome.

No items found.