How to remove white space above header in WordPress

The mysterious white space of WordPress – a common problem and cause of frustration among new WP Template go getters, trying to throw together their very first template.

Fear not!  There is an explanation for this anomaly and it lies in your nearly perfect code.  The white space that you see is actually where the WordPress user bar or navigation bar is displayed.  I spent an embarrassingly long time trying to figure it out (which is understandable when you are new to wordpress!) but I guess it’s obvious when you realize there was something there before.

The easy fix for this problem is to reinsert the snippet of code you forgot.  You are missing either the wp_footer or wp_head snippets, or both of them:

<?php wp_head(); ?> (Placed before the </head> tag in your header)

<?php wp_footer(); ?> (Placed before the </body> tag in your footer)


The above is the most common fix, but as usual there are always other reasons why you might have this problem.  If our suggested fix does not work, search your code for any paddings or margins that could be causing the issue – a tiresome task that can usually be made a lot easier with a browser addon like Firebug.

If you still have an issue, let us know below.

Related Links: Admin bar missing;  Remove white space above header;