Reputation: 2056
i added my css functionality on certain div in header.php in order to create my own top bar on wordpress theme now i am facing only one issue that the wordpress top bar is appearing on chrome but not on IE9 and i coded the css accordingly by adjusting the top=28; which run perfectly on chrome as WP top bar appearing on it but not on IE9 because wordpress dashboard top bar is not appearing on it and extra top space of 28; appears
kindly let me know how can i fix it so it'll run perfectly on either browsers
Upvotes: 1
Views: 212
Reputation: 22161
You can style conditionally your top bar whether or not the admin bar from WordPress is displayed.
Check with Firebug or simply the source code of your page, you'll see that WP adds a class admin-bar
on the body
element. And .logged-in
too but I guess this one will appear whether or not the WP admin bar is displayed.
You can then style your top bar for your visitors and for yourself, example:
.softgenic-bar {
position: fixed;
top: 0;
left: 0;
color: white;
background: black;
}
.admin-bar .softgenic-bar {
top: auto;
bottom: 0;
background: darkred;
}
Don't forget to add/remove padding and margin accordingly if you position your bar completely elsewhere.
You could also decide to position your bar in absolute for yourself and fixed for your visitors. Or hide it if it's irrelevant for yourself, it entirely depends on its content (you don't need to subscrive to your own newsletter for example ^^ but drawing tools in an app should still be displayed)
Upvotes: 1
Reputation: 7442
WordPress top bar appears if you are logged into your WordPress Admin panel. Try logging in on IE9 and you'll see the Admin bar. Also, the Admin bar uses CSS with !important attribute. But you don't have to worry as this bar will not be visible to the visitors of your site.
This Bar has wasted a lot of my time when I was first working on Wordpress theme. You should design your theme keeping in mind that there is not such bar i.e. top = 0 (may be check it in another browser where you are not logged into Admin Panel to see the real picture)
Upvotes: 1