Need help migrating with Mosaic?
Whatever stage you're at, we're here to support your migration. Our team is happy to answer any burning questions or help you move confidently with Mosaic.
Replicate the look of CSS and Div macros in Confluence Cloud
If you've used Mosaic: Content Formatting Macros & Templates for Data Center (DC), you'll be familiar with the CSS Style Sheet and Div macros. These macros enable you to add CSS and HTML to your Confluence pages, which is ideal for custom styling and branding.
Confluence Cloud changes things up a little bit, meaning you no longer need to know how to code to create tailored pages. Now, designing content is actually quicker and more accessible for everyone. Read on to find out how.
How the CSS Style Sheet and Div macros work in DC
In Confluence Data Center, Mosaic's Div and CSS Style Sheet macros are generally used in conjunction to apply custom styles to content.
The Div macro wraps your chosen content in a <div> tag, letting you add identifying classes that you can refer to in the CSS Style Sheet. You can also add some basic custom styling to the individual div.
The Div macro lets you assign classes and add rudimentary styling to individual elements on a page
The CSS Style Sheet macro contains design information for all your designated classes, such as their background and font colours. Using a style sheet macro lets you tailor different sections of your Confluence page in one go, making it a more efficient way to design in bulk.
Can I use the CSS Style Sheet and Div macros in Confluence Cloud?
Confluence Cloud’s no-code editor is designed to be accessible for all, meaning that you no longer need the Style Sheet and Div macro to create custom styling effects.
With the help of Mosaic's Cloud macros, anyone can create beautiful pages, not just the techy few who know how to use HTML and CSS.
Mosaic for Cloud lets you use CSS-like styling with no coding knowledge
Ready to learn more? We've created a range of handy tutorials to get you started.
How to use CSS-like styling in Confluence Cloud
How to overlay text onto an image
Want to make your titles pop? Here's how to overlay a snippet of text onto an image without any design tools.
⏰ Setup time: 2 minutes or less
How to apply custom colours to page text
Go beyond Confluence’s built-in 18 shades and choose whatever font colour you like. It’s quick and it’s easy.
⏰ Setup time: 2 minutes or less
How to adjust the corner radius of an image
Make your Confluence images friendlier and more professional in seconds. It's easier than you think.
⏰ Setup time: 2 minutes or less
How to add a colour overlay to an image
Change the mood of your Confluence page in an instant with a quick colour overlay. It’s perfect for making stand-out branded content.
⏰ Setup time: 2 minutes or less
