JSFiddle - React, Tailwind, and code Playground

HTML

<h2><span></span><span>Centered Header Text</span><span></span></h2>

CSS

body {
    background: #ccc
}

h2 {
    text-align: center;
    display: table;
    width: 100%
}
h2 > span:first-child, h2 > span + span + span {
    background: url(http://dummyimage.com/2x1/f0f/fff&text=+) repeat-x center;
    width: 50%;
    display:  table-cell 
}
h2 > span {
    display: table-cell;
    white-space: nowrap;
    padding: 0 9px
}