I have been using Bootstrap sometime now, we love it so much at our company that we have decided to use for our web app. Recently I used it to format the tables in our app and due the responsive nature of bootstrap it just naturally works, here is a link to their base component so you can see it in action: http://twitter.github.com/bootstrap/base-css.html#tables. You can hide and show the columns by simply tagging you elements or divs with a class of ‘hidden-phone’ or ‘visible-phone’ respectively. That was a big win for us due to the responsive nature of bootstrap, now for my main issue.
In the mobile version of the site I wanted to pop up a bootstrap modal window and allow the user to fill out some fields, here is the link to the modal examples http://twitter.github.com/bootstrap/javascript.html#modals. This works exactly as expected minus one little gotcha, the body of the modal, if greater than 400px I believe, will go past the bottom of the screen on a phone, particularly the iPhone, thus leaving the user stranded with a screen they can’t close. In comes the Modal Responsive Fix which was written by Nifty Lettuce, which I have no affiliation with but I am so thankful for this JQuery plugin cause it really saved my bacon with this. Here is the link to his fix: http://niftylettuce.github.com/twitter-bootstrap-jquery-plugins/, I will let you look over there for how to get it and set it up with your app.


