<div class="card-horizontal overlay"> <div class="horizontal-image"> <img src="https://picsum.photos/400" alt="image" /> <div class="text-overlay"> <h3>Empire State Building</h3> <small>By Abhi</small> </div> </div> <div class="card-content"> <p> Lorem ipsum dolor, sit amet consectetur adipisicing elit. At reiciendis rem a explicabo ipsum fugiat, aut suscipit quas et consequatur numquam dignissimos unde fugit debitis corrupti quidem perspiciatis ullam ducimus. </p> </div> <div class="card-footer"> <a href="#">SHARE</a> <a href="#">LEARN MORE</a> </div> </div>
Preview:
downloadDownload PNG
downloadDownload JPEG
downloadDownload SVG
Tip: You can change the style, width & colours of the snippet with the inspect tool before clicking Download!
Click to optimize width for Twitter