Create a STOP sign (a red circle with a white stripe and double border) using only one div and CSS (pseudo-elements are allowed).

To create a STOP sign with a red circle, white stripe, and double border using a single div and CSS with pseudo-elements, you can do the following:

.stop-sign {
  position: relative;
  width: 200px;
  height: 200px;
  background: red;
  border: 8px solid white; /* inner white border */
  border-radius: 50%;
  box-sizing: border-box;
  outline: 8px solid #8B0000; /* outer dark red border */
}

.stop-sign::before {
  content: '';
  position: absolute;
  top: 50%;
  left: 0;
  width: 100%;
  height: 40px;
  background: white;
  transform: translateY(-50%) rotate(-15deg); /* tilt of the stripe */
  border-radius: 4px;
}

<div class="stop-sign"></div>

Explanation:

• The div with class .stop-sign is a red circle with a double border: the outer border via outline, the inner border via border.
• The pseudo-element ::before is a white stripe, positioned horizontally with a slight tilt, mimicking a "STOP" sign.

You can adjust sizes and colors for a more precise match.