Strange CSS probem

  • matt987

    (@matt987)


    13 years, 1 month ago

    I’m developing a theme and it is just about finished. Offline ( pure html demo ) everything works fine in all major browsers. However, when I put the theme into WordPress a problem arises with firefox only. A margin appears at the top. Using firebug I was able to figure out that for some reason the theme is calling an extra stylesheet called admin-bar.css. I have not included that at all in my header.php and am not sure where it is coming from or how to get rid of it. If anyone has any ideas please let me know. Thanks.

Viewing 1 replies (of 1 total)
  • webmagix

    (@webmagix)

    13 years, 1 month ago

    add the following to your theme’s functions.php file or add it to a plugin, whichever you prefer

    <?php function sc_fix_admin_bar_search() { ?>
<style>
#wpadminbar #adminbarsearch { float: right; height: 18px; padding: 3px; margin: 0; width: 215px;}
          #wpadminbar #adminbarsearch .adminbar-input { width: 215px; height: auto; float: left; font: 12px Arial,Helvetica,sans-serif; color: #555; text-shadow: 0 1px 0 #fff; border: 1px solid #444; border-color: #808080 #686868 #686868 #808080; padding: 2px 75px 2px 6px; margin: 0 3px 0 0; background: #ddd; -webkit-border-radius: 10px; -khtml-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; outline: none; }
          #wpadminbar #adminbarsearch .adminbar-input:focus { -moz-box-shadow: 0 0 5px #DDD, 0 0 3px #DDD; -webkit-box-shadow:  0 0 5px #DDD, 0 0 3px #DDD; box-shadow: 0 0 5px #DDD, 0 0 3px #DDD; border-color: #DDD; }
          #wpadminbar #adminbarsearch .adminbar-button { font: normal 12px Arial,Helvetica,sans-serif; color: #ddd; text-shadow: 0 -1px 0 #444; cursor: pointer; float: right; background: #aaa; background: -moz-linear-gradient(bottom,#6e6e6e,#515151); background: -webkit-gradient(linear,left bottom,left top,from(#6e6e6e),to(#515151)); -webkit-border-radius: 10px; -khtml-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; border: 1px solid #808080; border-color: #808080 #686868 #686868 #808080; padding: 2px 13px; margin: 0; width: auto; height: auto; position: relative; top: -22px; top /*\**/: -21px\9; *top: -21px; }
               #wpadminbar #adminbarsearch .adminbar-button:active { background: #555555; text-shadow: 0 1px 0 #444; background: -moz-linear-gradient(center bottom , #555555, #3E3E3E); background: -webkit-gradient(linear,left bottom,left top,from(#555555),to(#3E3E3E)); -moz-box-shadow: inset 1px 1px 1px #222; -webkit-box-shadow: inset 1px 1px 1px #222; box-shadow: inset 1px 1px 1px #222; border-color: #111 #222 #222 #111;}
               #wpadminbar #adminbarsearch .adminbar-button:hover { color: #FFF; }
               #wpadminbar #adminbarsearch .adminbar-button::-moz-focus-inner { border: none; }
</style>

<?php }

add_filter('wp_head', 'sc_fix_admin_bar_search');
?>
Viewing 1 replies (of 1 total)
  • The topic ‘Strange CSS probem’ is closed to new replies.

Tags