JSFiddle - React, Tailwind, and code Playground

by jeremyblalock

HTML

<div class='wrapper'>
    <div class='centered'>
        This text is horizontally centered.
        <div class='left'>
            This text is to the left of the centered text.
        </div>
    </div>
</div>

CSS

body {
    background: #f77;
    font-family: 'Helvetica Neue', sans-serif;
}
.wrapper {
    text-align: center;
}
.centered {
    display: inline-block;
    background: #0ff;
    position: relative;
    padding: 10px;
}
.left {
    position: absolute;
    right: 100%;
    margin-right: 20px;
    width: 100px;
    padding: 10px;
    top: 0;
    background: #ff0;
}