Tag Archives: css

Using Bootstrap & WordPress’ Fixed Position Menus Together

When using Bootstrap’s ‘Topbar’ (or any fixed position element) at the top of the page, you’ll have a problem with it and the WordPress ‘Admin bar’ laying atop each other. Here’s a quick and easy fix… provided you follow the examples from twitter.github.com/bootstrap.

.admin-bar .topbar { margin-top: 28px;}

WordPress attaches the admin-bar class to your body tag when you are logged in and the option is set to show the admin bar. Also useful, the logged-in class which gets attached when you are logged in, no matter your ‘admin bar’ preferences. These helper classes can be useful for any number of reasons, but especially here.

For now, it seems the WordPress Admin bar is 28px high. If this changes, you’ll have to edit your CSS to reflect the change. There are certainly other ways to inject the CSS, but this is likely as lightweight as you can get.

Advertisements
%d bloggers like this: