If IE8 is displaying all Bootstrap columns full-width, here’s the fix

I see a lot of reports online that Bootstrap 3 is not correctly displaying on IE 8, for example two side-by-side columns get displayed full-width and stacked (instead of side-by-side).

If you’ve already added the required IE8 patch shown below, be sure you are adding that after the bootstrap.css file is loaded. (If you load it before boostrap.css it will not work.)

<!-- [if lt IE 9]>
<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
<script src="https://oss.maxcdn.com/respond/1.3/respond.min.js"></script>
< ![endif]-->


Getting Glyphicons to work with static Bootstrap 3 CSS and Rails 3.2

Glyphicons will not work correctly on production Rails apps in the default static Bootstrap 3 installation. The issue is that the compiled (static) Bootstrap CSS file has hardwired location ../fonts for the fonts that will not work with the default Rails asset pipeline. I’ve seen several solutions on the web that involve editing the Bootstrap CSS file, but I dislike that approach since it breaks the next time you install an updated Bootstrap unless you remember to re-make the same edits.

Copy the entire Glyicons /fonts folder to the app/assets/stylesheets folder, e.g., put the fonts in a fonts subdirectory of the stylesheets folder.

Add the following to bootstrap_and_overrides.css

/* Override Bootstrap 3 font locations */ 
@font-face { 
  font-family: 'Glyphicons Halflings'; 
  src: url('/assets/fonts/glyphicons-halflings-regular.eot'); 
  src: url('/assets/fonts/glyphicons-halflings-regular.eot?#iefix') format('embedded-opentype'),
  url('/assets/fonts/glyphicons-halflings-regular.woff') format('woff'), 
  url('/assets/fonts/glyphicons-halflings-regular.ttf') format('truetype'), 
  url('/assets/fonts/glyphicons-halflings-regular.svg#glyphicons_halflingsregular') format('svg'); 

We’re a fan – Filepicker.io

One of our web apps relies upon over a dozen third-party api-based services,  and none are more impressive than Filepicker.io, a service that gracefully handles the gnarly details of providing a user-friendly, sexy, full-featured UI for customers to upload images.


Integrating Filepicker.io into our web app was a snap, due to their well-thought-out API and support for features such as upload-to-S3.

Their pricing has gone up quite a bit since the service was introduced in late 2013, but unlike some companies mentioned in this blog (yeah, I’m calling you out yet again, Zerigo) they grandfathered early adopters with a special plan.