web site design Archives

UPDATE - February 10, 2014 There were a couple errors in the instructions and code below. I have corrected these errors in a new blog post. Multi Level Drop Down Menu Bootstrap 3 Drop Down Menu Design When Twitter Bootstrap 3 was released one element that was missing was support for multi-level dropdown menus. While the Bootstrap developers argued that the need for multi-level was minimal at best, the fact remained that removing them from the core product left many web developers out in the cold. While there is many articles providing workarounds through CSS to achieve desired results, one critical piece that is missing from the puzzle is responsive support. While the workarounds work great for desktops, laptops, and even some tablets, they fail to work for all mobile devices. After endless Google searches and hacking around in the Bootstrap 3.0 JavaScript file I was able to create a workaround that works that is responsive and works on all devices. Since I needed this … [Read more...] about Responsive Multi level Drop Down Menu Bootstrap 3

As I continue to refine my custom WordPress Bootstrap theme here on my site, I recently ran into an issue where I wanted to style Bootstrap tooltips. I wanted to create a custom style via CSS for the tooltip to remove the default white on black. If you are unsure what a tooltip is or how they appear you can hover over any of the social media icons in the footer of this page. I figured this would be an easy and quick fix. I got the easy part right, but finding the specific fix was a little more challenging. Since the tooltips only appear with a hover and are generated via JavaScript it was a bit confusing finding the exact styles and what to make changes to. In the end I was able to sort through the Bootstrap 3.0 styles to find the ones I needed to override. The tooltips I use for this site appear on top of the item being hovered over. To alter those there are two class styles you must override in your own stylesheet. The first is the .tooltip-inner and the second is the .tooltip-top … [Read more...] about Style Bootstrap 3.0 tooltips