Setting column widths

  • 1
  • Question
  • Updated 8 years ago
  • Answered
I've set up a site with a 3 column layout. Is there a way to adjust their widths without an html widget and div tags? I'd like to set a specific width for each.

I'm sure this is simple.
Photo of Margie

Margie

  • 286 Posts
  • 25 Reply Likes
  • confused

Posted 8 years ago

  • 1
Photo of Emmy

Emmy

  • 5892 Posts
  • 299 Reply Likes
Hello Margie,

Unfortunately it is not possible to change the width of the columns in the various Layouts manually. The column widths are set to be a certain size, although they will re-size to fit what is in them, and then the other columns will adjust.

Example: If you are using a 3 column layout and put an image into one of the columns that is larger than the column width, the image will fit, and the column the image is in will adjust, and the other two columns will also adjust in size as well.

If you want to use a column layout that adjusts easily, I can suggest the Column Divider widget which is located on the Widgets Sidebar. If you keep your site as an 1 column layout, and drag a Column Divider widget onto the page, you will be able to adjust the size of the widget using the middle line. You can then create more columns by adding another Column Divider widget to one or both sides of the first Column Divider widget.

To add content to the columns, you can then drag the other various widgets (ie Text, Image, etc.) into the various columns.

I hope this will help you create a column setup you would like.

Emmy
Photo of Margie

Margie

  • 286 Posts
  • 25 Reply Likes
Thanks, Emmy.

So for a 3 column page that has both narrow left and right columns with a wide middle column, would it be easier to start with a 3 column layout or just use the single column and use the dividers?

I may end up going the route of html widgets with div tags either way.
Photo of Nazlie

Nazlie

  • 1721 Posts
  • 51 Reply Likes
Hi Margie

Emmy is currently offline, but I am able to help you.
You are correct in saying that you cannot adjust the 3 column page layout. You can use a one or two column layout and then user the Column Widget or Text Widgets to lay the page out to suit your needs.
Another option, is to use a table using the HTML Helper in this link: http://html101.yolasite.com/.
If you need more help with this, please get back to us.
Nazlie