Provide figure and aside margins.


Add default margins for aside and figure.

Bootstrap Reboot (which Guise Skeleton uses as a reset) in v4.1.3 doesn't provide any margins for <aside>, and provides an inadequate margin for <figure>:

Semantically asides and figures are the same sort of thing—at least insofar as they are separated from the main text. As such they should probably have margins all around.

There's no need for added CSS variables, as these are normal HTML elements which normal CSS selection can override as needed.




Garret Wilson
August 18, 2020, 2:07 PM

This ticket's description assumes that the figures and asides are being floated. The Reboot definitions probably assume they are in normal block flow, which is why they follow the Reboot definitions of common block elements such as <p>, which are also defined with only a bottom margin:

Nevertheless it would be difficult to add side margins only when they are floated, because we can't select on CSS properties. We could select on float-start and float-end, but that is (currently) defined in the layout module, not the base module where <aside> and <figure> would be defined.

In general we should add as few styles as possible, following Reboot, but perhaps this is one case that general left and right margins would be possibly useful or at least semantically appropriately, even if not floated.

However we'll probably want to leave off the top margin, following <p> et. al.; the thing above it will probably already have a bottom margin.



Garret Wilson


Garret Wilson




Fix versions