Split Badges with Twitter Bootstrap and HAML

I recently needed to display a few contextual numbers near each other in a web app. I’ve taken to liking the twitter bootstrap ‘badges’ for little informational numbers, especially with the color coding that badge-important, badge-info, and badge-success provide. Easy ways to quickly communicate not only the number, but a hint at what it means. The problem is that when you put a bunch of badges right next to each other, you get kindof a mess. ...

July 19, 2012 · 2 min · Mark Simoneau

CSS3 max-width and min-width selectors

I learned recently about min-width and max-width css selectors that allow you to specify certain properties that are applied under a maximum width and above a minimum width. This can enable a flexible layout that works on many different screens without multiple distinct layouts (instead, just CSS). This also makes it relatively easy to spot-test by simply resizing your browser to get an idea of how it will look on different size devices. ...

May 16, 2012 · 1 min · Mark Simoneau