JSFiddle - React, Tailwind, and code Playground

HTML

<div>
    <aside class="aside_article">
        <p class="day">15</p><p class="month">Septembre</p>
    </aside>
</div>
<div>
    <aside class="aside_article">
        <p class="day">15</p><p class="month">Juin</p>
    </aside>
</div>

CSS

div:first-child {
    background-color: red;
    min-width: 100px;
    min-height: 100px;
    position: absolute;
    top: 50%;
    left: 25%;
}

div {
    background-color: red;
    min-width: 100px;
    min-height: 100px;
    position: absolute;
    top: 50%;
    left: 75%;
}
.aside_article {
	position: absolute;
	left: -3em;
	width: 2em;
	background-color: yellow;
	padding: 1em 0.7em 1em 0.3em;
	font-size: 1.5em;
}

.aside_article p {
	display: table-cell;
}

.aside_article .day {
    width: 1.3em;
    text-align: right;
}

.aside_article .month {
	-webkit-transform: rotate(-90deg);
	transform: rotate(-90deg);
    position: absolute;
    top: 0px;
    right: -0.2em;
}