Responsive Design Archive
04 Dec 2014
Grid Systems – 24 Columns Feels Nicer Than 12!
With many web development projects, you’ll find yourself reaching for a grid system to kick things off. Bootstrap and Foundation are usually the “go-to” for this, and that’s because they are both easy to use and easy to implement, while also boasting many features. Plus, they’re “battle tested”, so you more-or-less should know what to
13 Aug 2014
Guide: How to Make Boostrap 3 Support IE8
Need to support IE8 when using Bootstrap 3? It isn’t too hard (thankfully). Follow this little tutorial and you’ll be on your way to success! 1) Use the latest version of Bootstrap! This is key. Older versions utilized max-height/width and min-height/width, and when joining that with box-sizing, it can cause compatibility issues. This was remedied
27 Jun 2014
Bootstrap 3.2.0 Released! – Brings Responsive Video Embeds
Okay. So it brings a lot more than just responsive support to things like YouTube videos, but that is definitely one of the highlights! No longer will you be required to use things such as FitVids.js (an awesome script, by the way) in your Bootstrap projects just to make videos responsive. And if you did
17 Jan 2014
Bootstrap 3: Change Stacking Order
Changing the stacking order of columns in Twitter’s Bootstrap 3 is actually easier than you may think. Excited yet? Calm down. Below is an example situation where you may want to change the stacking order. We have a nice 2 column row that has text on the left and an image on the right. This
05 Nov 2013
CSS: How to Easily Hide Content On Only Mobile or Only Desktop
One of the great things about Twitter’s Bootstrap 2 and Bootstrap 3 are the responsive utility classes. It makes hiding / showing content on only specific resolution sizes or devices easy. Other than the grid system, it’s one of the key features utilized in the framework. What if you wanted to bring that over to
29 Oct 2013
Bootstrap 3: How to Enable Hover and Toggle for Nav
By default, Bootstrap 3’s navigation has menus toggle’able — you click to have them open / show, and click to have them shut (hide). Wouldn’t it be nice to also have menus open through hovering your mouse over them? Luckily, it isn’t complicated to do! And the best part? It only takes minor CSS to
04 Sep 2013
Outlook 2010 – Responsive Email Template Using Conditionals and Media Queries
Responsive design is thought of generally as just a technique for websites. People don’t generally think about the role it plays in emails. But they should. Designing for email is a different beast. If you thought designing for websites was a pain, then you haven’t had to deal with the different email clients out there