Thanks.
- Pete
A content editor for Joomla!®
You need to be logged in to post in the forum - Log In
An active JCE Pro Subscription is required to post in the forum - Buy a Subscription
Everybody will be able to see its contents. Do not include usernames, passwords or any other sensitive information.
Latest post by globinli on Tuesday, 13 July 2021 09:57 BST
I love the new column feature. It's a gamechanger! I've begun using it on client sites.Thank you, and this is just the start. I hope to add improvements and new features in Columns in the future, which brings me to...
Almost, without exception, I'm requested to add more space between the columns so that the right side of the text isn't so close to the left side of the text in the next column. Is this possible to adjust?I am working on an additional option to set in the Columns dialog to select a spacing value, eg: Small, Medium, Large, but until then, you can use css in you template stylesheet to add custom spacing, eg:
[data-wf-columns] > div,
.wf-columns .wf-column {
margin: 0 1em;
}
Ryan Demmer
Lead Developer / CEO / CTO
Just because you're not paranoid doesn't mean everybody isn't out to get you.
Ryan Demmer
Lead Developer / CEO / CTO
Just because you're not paranoid doesn't mean everybody isn't out to get you.
Ryan Demmer
Lead Developer / CEO / CTO
Just because you're not paranoid doesn't mean everybody isn't out to get you.
Ryan Demmer
Lead Developer / CEO / CTO
Just because you're not paranoid doesn't mean everybody isn't out to get you.
[data-wf-columns] > div,
.wf-columns .wf-column {
margin: 0 1em 0 0;
}
In a few weeks, when Chrome 84 is released, you can use the gap property instead (currently only supported in Firefox), eg:
[data-wf-columns,
.wf-columns {
gap: 1rem 0;
}
Ryan Demmer
Lead Developer / CEO / CTO
Just because you're not paranoid doesn't mean everybody isn't out to get you.
@media (max-width: 960px){
.wf-columns-stack-medium>.wf-column {
width: 100%;
margin-left: inherit !important;
margin-right: inherit !important;
flex: auto !important;
}
}
.wf-columns .wf-column {
max-width: 100%;
margin-left: 15px;
box-sizing: border-box;
flex: 1;
}
Hope it helps! 🙂 Ryan Demmer
Lead Developer / CEO / CTO
Just because you're not paranoid doesn't mean everybody isn't out to get you.
Ryan Demmer
Lead Developer / CEO / CTO
Just because you're not paranoid doesn't mean everybody isn't out to get you.
.wf-columns-gap-small {
gap: 0.25rem;
}
.wf-columns-gap-medium {
gap: 0.5rem;
}
.wf-columns-gap-large {
gap: 1rem;
}
.wf-columns-gap-none {
gap: 0;
}
Ryan Demmer
Lead Developer / CEO / CTO
Just because you're not paranoid doesn't mean everybody isn't out to get you.
@media (max-width: 640px) {
.wf-columns + .wf-columns:nth-of-type(2n) > .wf-column:first-child {
order: 99;
}
}
Ryan Demmer
Lead Developer / CEO / CTO
Just because you're not paranoid doesn't mean everybody isn't out to get you.
But what, if I need a very speciel layout? Something like 1-5 or 45%-55% or 200px - 850px?
Ryan Demmer
Lead Developer / CEO / CTO
Just because you're not paranoid doesn't mean everybody isn't out to get you.
Your post is being submitted…