JSFiddle - React, Tailwind, and code Playground
HTML
<h2>
<span class="uniform-bg">
<span>Hello everyone</span>
</span>
</h2>
CSS
body {
background: url('http://css-live.ru/wp-content/themes/css-live/images/headBg_top.gif');
padding: 20px;
}
h2 {
line-height: 1.15;
font-size: 2.2em;
color: white;
text-transform: uppercase;
font-family: sans-serif;
width: 6em;
}
.uniform-bg {
background: rgb(18,106,239); /*для старых браузеров, которые не понимают rgba отображаем без прозрачности*/
background: rgba(18,106,239, 0.4);
position: relative;
outline: rgb(18,106,239) solid 0.3em;/*для старых браузеров, которые не понимают rgba отображаем без прозрачности*/
outline: rgba(18,106,239, 0.4) solid 0.3em;
-moz-outline-offset: -0.04em;
}
.uniform-bg span {
position: relative;
}