Tip 101Alphabetize the Properties of Each Rule in a CSS File

When combining an Ex command with :global, we can also specify a range for our chosen [cmd]. Vim allows us to set the range dynamically using the :g/{pattern} as a reference point. Here we’ll see how we can exploit this fact to alphabetize the properties within each block of a CSS file.

We’ll use this CSS file for demonstration purposes:

1: html {
margin: 0;
padding: 0;
border: 0;
5:  font-size: 100%;
font: inherit;
vertical-align: baseline;
body {
10:  line-height: 1.5;
color: black;
background: white;

Suppose that we want to sort the properties of each rule into alphabetical order. We could do so using Vim’s built-in :sort ...

Get Practical Vim, 2nd Edition now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.