Helpers
A selection of useful styles to format your content.
Constrain content
A single page (without sidebar) can sometimes be too wide for the content it’s displaying. Wrap the whole page within the following helper div to constrain the content when viewed on desktop. This is not recommended for use within the Editorial Suite.
Constrain content
Image circle
You can make a square image appear as a circle by adding the following class to the <img>
tag.
SVG image
Sometimes you need to set a width for SVG images so they display correctly. Add the style as shown below and change the width accordingly.
Full width
Make a figure display full width. Do not use when floating.
Make an image display full width. Do not use when floating.
Text centre
To centre text use the following class.
This is some text centred in a paragraph.
Horizontal rule
Use the horizontal rule tag to separate content.
End of a paragraph/section.
Heading
Start of a new paragraph/section.