Create a responsive square element containing an image using ::after pseudo class.
Continue reading “How to create a responsive square image with CSS”Flexbox to add a spacer
Use Flexbox to push content.
// The span takes up any remaining space between left and right
<div>left</div>
<span style=“flex: 1 1 auto”></span>
<div>right</div>Code language: HTML, XML (xml)Bootstrap 4 breakpoints and media queries
Quick reference for the Bootstrap 4 media breakpoints.
Continue reading “Bootstrap 4 breakpoints and media queries”HTML5 Video Streaming from Google Drive
A method for serving HTML5 video on your website via Google Drive, saving bandwidth and reducing server load.
Continue reading “HTML5 Video Streaming from Google Drive”Adding a non-standard font to your website
In this article I will explain how to define a new font-family using @font-face and WOFF type fonts, which are supported by nearly every web browser.