Child

A child combinator in CSS is the “greater than” symbol, it looks like this:

ol > li {
  color: red;
}

It means “select elements that are direct descendants only”. In this case: “select list items that are direct descendants …

Avatar of Sara Cope
Sara Cope on (Updated on )

::before / ::after

The ::before and ::after pseudo-elements in CSS allows you to insert content onto a page without it needing to be in the HTML. While the end result is not actually in the DOM, it appears on the page as if …

Avatar of Sara Cope
Sara Cope on (Updated on )

[attribute]

There are lots of ways you can select elements in CSS. The most basic selection is by tag name, like p { }. Almost anything more specific than a tag selector uses attributes — class and ID both select …

Avatar of Sara Cope
Sara Cope on (Updated on )

Adjacent sibling

The adjacent sibling combinator in CSS isn’t a selector on its own, but a way of combining two selectors. For example:

p + p {
  margin: 0;
}

The plus sign (+) is the adjacent sibling combinator, between two paragraph …

Avatar of Sara Cope
Sara Cope on (Updated on )

:active

The :active pseudo selector changes the appearance of a link while it is being activated (being clicked on or otherwise activated). It’s usually only seen for a split second, and provides visual feedback that the element was indeed clicked. It’s …

Avatar of Sara Cope
Sara Cope on (Updated on )

zoom

The zoom property in CSS allows you to scale your content. It is non-standard, and was originally implemented only in Internet Explorer. Although several other browsers now support zoom, it isn’t recommended for production sites.

.zoom {
  zoom: 150%;
}
Avatar of Sara Cope
Sara Cope on (Updated on )

z-index

div {
  z-index: 1; /* integer */
}

The z-index property in CSS controls the vertical stacking order of elements that overlap. As in, which one appears as if it is physically closer to you. z-index only affects elements that …

Avatar of Sara Cope
Sara Cope on (Updated on )

widows

In typography terms, a widow is the last line of a paragraph that is left alone on a new page or in a new column. The widows property in CSS controls the minimum number of lines of a paragraph that …

Avatar of Sara Cope
Sara Cope on (Updated on )