Normally you'd use a StyleSheetExtension object and use something like:
.column.first-column{ width:75%; }
However this may not work because your SSX may be loaded after the columns.css which is loaded dynamically by the Container Macro. And thus the the width defined in columns.css will override whatever value you have put.
Unfortunately at this point there's no priority for JSX/SSX and it's not possible to order them....
However by using CSS precedence rules we can trick our way in
Would there be a way to give specific widths for more than three columns? E.g. if I make 4 columns, I can see "first-column", "last-column" and simply "column" for the two in between. Is there any way to address the middle two separately?
Is there any way to specific the column witdths within the container?
For example:
(((first column)))
(((second column)))
{{/container}}
Normally you'd use a StyleSheetExtension object and use something like:
width:75%;
}
However this may not work because your SSX may be loaded after the columns.css which is loaded dynamically by the Container Macro. And thus the the width defined in columns.css will override whatever value you have put.
Unfortunately at this point there's no priority for JSX/SSX and it's not possible to order them....
However by using CSS precedence rules we can trick our way in
Use this in your SSX (for example):
width:20%;
}
div.container-columns div.last-column {
width:75%;
}
Would there be a way to give specific widths for more than three columns? E.g. if I make 4 columns, I can see "first-column", "last-column" and simply "column" for the two in between. Is there any way to address the middle two separately?