Documentation

split

[split(, css-styles, width, class, id)]
…
[splitend]

with keys

[split(, style=, width=, class=, id=)]
…
[splitend]

Create a layer to hold objects in a column.

Parameters

style - optional parameter specifying css-styles to be applied to this layer
width - optional parameter specifying widths of this layer
browser page width > 1024px

default (blank) = 40% container layer width with margin:5%
75 = 75% container layer width
66 = 66% container layer width
50 = 50% container layer width
33 = 33% container layer width
25 = 25% container layer width

browser page width < 1024px

default (blank) = 90% container layer width with margin:5%
75 = 100% container layer width
66 = 100% container layer width
50 = 100% container layer width
33 = 50% container layer width
25 = 50% container layer width

browser page width < 768px

default (blank) = 90% container layer width with margin:5%
75 = 100% container layer width
66 = 100% container layer width
50 = 100% container layer width
33 = 100% container layer width
25 = 100% container layer width

class - optional class name
id - optional id

See Also

css-styles

Changes

1.37 - updated, id parameter added
1.37 - accepts key=value pairs as parameters
1.31.18 - updated, class parameter added
1.24.12 - fixed, Split75 class missing
1.14.7 - fixed, tag ignored unless it contains a comma ie. [split,] or [split,…]

Examples

Example#1 2 splits

[split]
[heading,Heading 1]
body text 1
[splitend][split]
[heading,Heading 2]
body text 2
[splitend]

Output:

Heading 1

text 1

Heading 2

text 2

Example#2 50% coloured splits with images

[split,background-color:#FF901F; color:#ffffff,50]
[heading,Travel]
[image,image2.jpg,100%]
[splitend][split,background-color:#FFD319; color:#000000,50]
[heading,Transport]
[image,image1.jpg,100%]
[splitend]

Output:

Travel

Transport

Notes

Ensure the [split] items do not have extra blank lines or whitespace after the [splitend] as this can stop the items from fitting next to each other:

[split,,33]
…
[splitend][split,,33]
…
[splitend][split,,33]
…
[splitend]

If using [include] to add a series of splits to a page you may have to keep the includes on the same line, next to each other, to ensure the items fit next to each other on the page:

[include,split1][include,split2][include,split3]

Also ensure that the included item does not have any blank lines after the [splitend]