Series: Guide to CSS

This is an important skill when making character sheets. Here’s how to do it with CSS.

The basics of CSS – syntax, what a declaration block is, how to apply properties, etc.

How to arrange elements on the page. Understanding the box model of CSS and the display property.

Decorating the sheet with images and colour.

Text and associated properties (such as underlining and shadow effects), and using Google Fonts.

Lying out your sheet into columns and grids, with a surprisingly simple system.

How to target elements and blocks, and apply your styles to the sheet.

Understanding the tricky concept of Specificity, and how styles override each other.

Overriding Roll20’s built-in styles, creating your own roll buttons, and even modifying the GUI.

Understanding the position property, which can be a bit mindbinding.

Upgrading the Castle Falkenstein sheet created in the HTML guide to use CSS.

The dice icon in roll buttons was a great idea. Here’s how to remove it.