I’ve seen this Bootstrap issue countless times. A collapsed div is collapsed and expanded with Bootstrap Collapse. When it opens up, it appears to over-expand and then jump back up. It’s super annoying.
Here’s what your code might look like:
<div class="collapse alert alert-info" id="my-alert-box">My hidden alert box with some text.</div>
Here’s what you should do:
<div class="collapse" id="my-alert-box">
<div class="alert alert-info">My hidden alert box with some text.</div>
The collapsed div can’t have padding applied to it. By moving the alert inside of the collapsed div, we solve the problem.
Working with WordPress and Bootstrap, you might be frustrated with the built in menu options. There isn’t an easy way to tell WordPress to swap out the current-menu-item class with bootstrap’s active class. Fortunately for you and me, there’s jQuery for that. Just a little dab will do ya.
Bootstrap has a way making a lot of HTML elements look good, right off the bat. But the day finally came when I had to face to inevitable: The <input type=”file”>. This is the red headed stepchild of Bootstrap (and browser makers). Browsers render this element differently from each other, making it nearly impossible to look good across the board.
A speedbump is a essentially a confirmation dialogue when a website visitor clicks a link to leave your site. Speedbumps are actually required by law in some countries for industries such as Credit Unions and banks. There are several ways to create a speedbump, and I’m going to show you just one way. You can borrow or adapt any part of these methods for your own site. Continue reading Create a SpeedBump with jQuery & the Bootstrap Modal