Card - Many Variable

Lorem ipsum dolor sit amet, consectetur adipiscing elit. In venenatis odio elit, faucibus blandit tellus mollis ut. Donec vel nibh at nisl fermentum sodales nec quis risus. Nullam et magna in metus vulputate fermentum a a augue.

> Learn more

Card - Many Variable

Lorem ipsum dolor sit amet, consectetur adipiscing elit. In venenatis odio elit, faucibus blandit tellus mollis ut. Donec vel nibh at nisl fermentum sodales nec quis risus. Nullam et magna in metus vulputate fermentum a a augue.

Action

Card - Many Variable

Lorem ipsum dolor sit amet, consectetur adipiscing elit. In venenatis odio elit, faucibus blandit tellus mollis ut. Donec vel nibh at nisl fermentum sodales nec quis risus. Nullam et magna in metus vulputate fermentum a a augue.

> Learn more Action

Card - Many Variable

Lorem ipsum dolor sit amet, consectetur adipiscing elit. In venenatis odio elit, faucibus blandit tellus mollis ut. Donec vel nibh at nisl fermentum sodales nec quis risus. Nullam et magna in metus vulputate fermentum a a augue.

Action > Action + Icon

Card - Many Variable

Any and any link are not considered card actions and should not be affected by card styles.

  • List Item A
  • List Item B
  • List Item C

    • Card - Many Variable

    Lorem ipsum dolor sit amet, consectetur adipiscing elit. In venenatis odio elit, faucibus blandit tellus mollis ut. Donec vel nibh at nisl fermentum sodales nec quis risus. Nullam et magna in metus vulputate fermentum a a augue.

    > Learn less > Learn more

    Card - Many Variable

    Lorem ipsum dolor sit amet, consectetur adipiscing elit. In venenatis odio elit, faucibus blandit tellus mollis ut. Donec vel nibh at nisl fermentum sodales nec quis risus. Nullam et magna in metus vulputate fermentum a a augue.

    Action 1 Action 2

    Card - Many Variable

    Lorem ipsum dolor sit amet, consectetur adipiscing elit. In venenatis odio elit, faucibus blandit tellus mollis ut. Donec vel nibh at nisl fermentum sodales nec quis risus. Nullam et magna in metus vulputate fermentum a a augue.

    Action 1 Action 2 > Learn more

    Card - Many Variable

    If actions are wrapped in a <p> tag, automatic layout is abandoned.

    Action 1 Action 2

    Card - Many Variable

    If actions are wrapped in a <p> tag, automatic layout is abandoned.

    > Learn less > Learn more

    A regular paragraph with a link and another link before the end, should not be affected.

    Card - Many Variable

    If you wrap link ("Learn more") in a <p> tag, then spacing will be wrong.*

    Action 1 Action 2

    > Learn more

    Card - Many Variable

    If you wrap actions ("Action N") in a <p> tag, then spacing will be wrong.*

    Action 1 Action 2

    > Learn more

    * Wrapping in a <p> tag was a fix in early 2023-01, but is now non-standard.