Hi MK,
To do this you’ll need to add some CSS to the following css-file.
/wp-content/plugins/shortcodes-ultimate/css/style.css
First make a back-up of this file , so you can restore the old situation should it be required.
To make these changes, use an EDITOR, NOT a wordprosessor like MSWord, but e.g.’NOTEPAD++’.
Step 1.
Open /wp-content/plugins/shortcodes-ultimate/css/style.css
On line 100 of this file you’ll find:
/* Colums */
.su-column-1-2 { width: 48% }
.su-column-1-3 { width: 30.66% }
.su-column-2-3 { width: 65.33% }
.su-column-1-4 { width: 22% }
etc.
The colums su-column-1-2 { width: 48% }both have a width of 48%.
Add your own code at the top.
Example:
.su-column-1{ width: 60% }
.su-column-2{ width: 30% }
You can add more colums…
Play around with the percentages, but stay within the 100% ad leave room between te columns.
Result:
/* Columns */
.su-column-1{ width: 60% }
.su-column-2{ width: 30% }
.su-column-1-2 { width: 48% }
.su-column-1-3 { width: 30.66% }
.su-column-2-3 { width: 65.33% }
etc.
Save and upload.
== == ==
Step 2
Open the dashboard and edit the page/ article in which you want to include columns.
Add[column size="1"]at the start of column1.
add[/column]at the end of column1.
==
Add[column size="2" last="1]at the start of column”2.
add[/column]at the end of column2.
Both columns now have the requires sizes.
== stating the obvious: only the final column has the last="1"] at the end. ==
Result in dashboard-editor:
[column size="1"]
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis tempor, lectus eu placerat dictum, erat mauris commodo felis, sed commodo ante augue ut nisl. Ut posuere dapibus libero a pellentesque.
[/column]
[column size="2" last="1"]
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis tempor, lectus eu placerat dictum, erat mauris commodo felis, sed commodo ante augue ut nisl. Ut posuere dapibus libero a pellentesque. Pellentesque tristique, felis sed pellentesque egestas, justo felis
[/column]
