JSFiddle - React, Tailwind, and code Playground

by sarahchima

HTML

<html>
	<body>
  	<div class="parent-element">
      <div class="sibling-element">
      	I'm the other sibling element
      </div>
      
    	<div class="main-element">
      	All eyes on me. I am the main element.
      </div>
      
      <div class="sibling-element">
      	I'm the other sibling element
      </div>
    </div>
    
  </body>
<html>

CSS

.sibling-element {
	background: #f2f2f2;
	padding: 10px;
} 

.main-element {
    position: absolute;
    bottom: 10px;
    left: 10px;
    background-color: yellow;
    padding: 10px;
}

.parent-element {
    position: relative;
    height: 100px;
    padding: 10px;
    background-color: #81adc8;
}