JSFiddle - React, Tailwind, and code Playground

by rjurado

HTML

<div class="error">
  <img src="http://gravatar.com/avatar">
  <span>Text</span>
</div>

<br>

<div class="error fixed">
  <img src="http://gravatar.com/avatar">
  <span>Text</span>
</div>

CSS

.error {
  background: grey;
  width: 400px;
  height: 50px;
  line-height: 50px;
  text-align: center;
}

.error img {
  vertical-align: middle;
  max-width: 100%; max-height: 100%;
}

.fixed {
  display: flex;
  justify-content: center;
}