You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
There's conflicting guidance on the borders (if any) that should be applied to teasers.
The teaser component page has horizontal dividers inside a content container between rows of teasers, and nothing inbetween vertical teasers:
The section landing template has horizontal dividers not in a content container, and has vertical dividers between vertical teasers (but not touching the horizontal dividers):
www.cam.ac.uk goes for a third variant! (Horizontal divider inside a content container, and the vertical dividers touching.)
(You'll also notice the problem of the vertical border: it's applied on the right of the first column, but the second is longer in this case. For two columns both columns should have the border, but for more JavaScript would be required to make the heights equal.)
www.cam.ac.uk/about-the-university (for example) then has a 4th(!) variant on teasers on pages inside the site (horizontal not in a container, and the vertical divider not touching and in the wrong(?) place):
None of these variants resolve an issue on the mobile view however:
There is no horizontal divider between the vertical teasers. In this case they actually run in to each other too. A horizontal divider should be mimicked through CSS (failing that, added by JavaScript).
The text was updated successfully, but these errors were encountered:
There's conflicting guidance on the borders (if any) that should be applied to teasers.
The teaser component page has horizontal dividers inside a content container between rows of teasers, and nothing inbetween vertical teasers:
The section landing template has horizontal dividers not in a content container, and has vertical dividers between vertical teasers (but not touching the horizontal dividers):
www.cam.ac.uk goes for a third variant! (Horizontal divider inside a content container, and the vertical dividers touching.)
(You'll also notice the problem of the vertical border: it's applied on the right of the first column, but the second is longer in this case. For two columns both columns should have the border, but for more JavaScript would be required to make the heights equal.)
www.cam.ac.uk/about-the-university (for example) then has a 4th(!) variant on teasers on pages inside the site (horizontal not in a container, and the vertical divider not touching and in the wrong(?) place):
None of these variants resolve an issue on the mobile view however:
There is no horizontal divider between the vertical teasers. In this case they actually run in to each other too. A horizontal divider should be mimicked through CSS (failing that, added by JavaScript).
The text was updated successfully, but these errors were encountered: