The ColumnGap property in the BaseStyles class represents the column-gap CSS property. This property is used to define the gap between columns in a multi-column layout. It is a nullable property of type Sandbox.UI.Length, allowing you to specify the gap in various units such as pixels, percentages, etc.
To use the ColumnGap property, you can set it to a specific length value to define the space between columns. If not set, the default gap will be used. This property is particularly useful when you want to control the spacing in a grid or flexbox layout with multiple columns.
// Example of setting the ColumnGap property var styles = new BaseStyles(); styles.ColumnGap = new Length(20, LengthUnit.Pixel); // Sets a 20px gap between columns // Example of using a percentage styles.ColumnGap = new Length(5, LengthUnit.Percent); // Sets a 5% gap between columns // Resetting to default styles.ColumnGap = null; // Removes the custom gap, reverting to default behavior