JSFiddle - React, Tailwind, and code Playground

by Rolf

HTML

<div class="verteiler">  <!-- oder nav -->
<a href="#">Kontaktieren Sie uns</a>
<a href="#">Projekte ansehen</a>
</div>

CSS

body {
  background-color: #888;
}
.verteiler {
  display: flex;
  flex-flow: row wrap;
  justify-content: center;
  position: relative;
  margin:auto;
  margin-top: 2em;
}
.verteiler::before {
  content: "oder";
  position:absolute;
	top: 50%;	transform: translateY(-50%);
  text-align:center;
  height: 3em; width: 3em; line-height: 2.9em;
  background-color: white;
  border-radius: 1.5em;
  font-size: 75%;
}
.verteiler a {
  display: block;
  text-align:center;
  width: 12em;
  padding: 1em;
  color: white;
  background-color: #744;
  box-shadow: 0 0 0px 2px #f66;
  text-decoration:none;
}