Format forum options with CSS and JavaScript

by Dunderklumpen

HTML

<div id="forumOptions">
  <span><a href=".">Mark Forum As Read</a></span>
  <span><a href=".">Subscribe to forum</a></span>
  <span><a href=".">Manage Subscriptions</a></span>
</div>

CSS

#forumOptions {
  display: flex;
  flex-wrap: wrap;     /* allow wrapping */
  gap: .5rem;          /* space between items */
}

#forumOptions span {
  white-space: nowrap; /* keep each item’s text whole */
}

#forumOptions span:not(:last-child)::after {
  content: "|";
  margin-left: .5rem;
}