<p>This is a paragraph of text with <a href="#">a link</a> and <button class="link-button">a button</button> in it. It’s pretty handy if you need interactivity within flow content.</p>
.link-button {
  display: inline;
  padding: 0;
  border: 0;
  font: inherit;
  text-decoration: underline;
  cursor: pointer;
  background: transparent;
  color: currentColor;

  -webkit-appearance: none;


Decorative styles


a {
  color: currentcolor;

article {
  padding: 1.5rem;

body {
  display: grid;
  place-items: center;

p {
  max-width: 50ch;

External CSS

  1. https://unpkg.com/modern-css-reset/dist/reset.min.css
  2. https://codepen.io/andybelldesign/pen/15713dd0e755b3da5cbb0bda5816368e.css
  3. https://codepen.io/andybelldesign/pen/035d4a2a1385000a0fa28c3d8c9e2768.css

External JavaScript

This Pen doesn't use any external JavaScript resources.