CSS Battles
About
Github
Back
Battle: #91
<div class="bottom"></div> <div class="sun"> <div class="line1"></div> <div class="line2"></div> <div class="line3"></div> <div class="line4"></div> </div> <style> div { position: absolute; } body { margin: 0; background: #d25b70; } .bottom { background: #6cb3a9; width: 100%; height: 50%; bottom: 0; } .sun { transform: translate(-50%, -50%); top: 50%; left: 50%; width: 200px; height: 200px; background: #f6df96; border-radius: 100%; } .line1 { background: #6cb3a9; width: 100%; height: 15px; top: 100px; } .line2 { background: #6cb3a9; width: 100%; height: 15px; top: 125px; } .line3 { background: #6cb3a9; width: 100%; height: 15px; top: 150px; } .line4 { background: #6cb3a9; width: 100%; height: 15px; top: 175px; } </style>