JSFiddle - React, Tailwind, and code Playground

by mgrcic

HTML

<div class="notification success_notification clrfix">
                <div id="email_confirmation_order_complete">
                    <span>You're going!  Your order is complete.</span>
                </div>
                    <div id="email_confirmation_email_existing">
                        <span id="email_confirmation_email_sent_to">An email confirmation has been sent to <strong>[email protected]</strong>.</span>
                    </div>
            </div>

CSS

.success_notification {
background-color: 
#9BC15C;
}

.notification {
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px;
color: 
white;
min-height: 50px;
font-size: 14px;
margin: 35px 0;
}

.clrfix {
}

.clrfix::after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}

#email_confirmation_order_complete {
float: left;
margin: 8px 0 0 20px;
font-size: 14px;
color: 
white;
_width: 300px;
}


#email_confirmation_email_existing {
float: right;
margin: 18px 20px 0 0;
_width: 500px;
text-align: right;
}