Ronalds Vilcins

Photo by Maik Jonietz on Unsplash

The CSS :empty pseudo-class selects any element that has no children or text.

/* Background color of every empty div element */
div:empty {
background-color: #000;
}
<div>
<p>Some text</p>
</div>
<div>
<!-- No text, background #000 -->
</div>

MDN’s definition:

The :empty CSS pseudo-class represents any element that has no children. Children can be either element nodes or text (including whitespace). Comments, processing instructions, and CSS content do not affect whether an element is considered empty.

--

--

Photo by Anne Nygård on Unsplash

If you want to display the total number of content pages that Hugo generated from a particular section use where to filter section pages:

<p>Total number of pages in the /articles/ section:
{{ len (where .Site.RegularPages "Section" "==" "articles") }}.
</p>

--

--

Photo by Luke Chesser on Unsplash
  • Windows: Press Ctrl + Shift + I then Ctrl + Shift P.
  • Mac: Press Command + Option + I then Command + Shift P.
  • Then type “screenshot” to see the four screenshot options.

Screenshot types

  • Capture area screenshot
  • Capture full size screenshot
  • Capture node screenshot
  • Capture screenshot

In Chrome version 89, the modified right-click element inspector allows us to capture a screenshot from the inspector.

--

--

Ronalds Vilcins

Ronalds Vilcins

I drink a lot of tea and build beautiful websites. If you are looking to work together or just start a conversation 👉 https://www.ronaldsvilcins.com/