XF 1.4 Custom Header Issue

[iguanairs]

I have been working on a custom header for a few days now and I am not certain what I am doing wrong. I can't prevent the header from being pushed down when I add another div with content.

This is the default code (header template):

<xen:edithint template="header.css" />

<xen:hook name="header">
<div id="header">
    <xen:include template="logo_block" />
    <xen:include template="navigation" />
    <xen:if is="{$canSearch}"><xen:include template="search_bar" /></xen:if>
</div>
</xen:hook>

I want this:

<xen:edithint template="header.css" />

<xen:hook name="header">
<div id="header">
<div class="name">Above the entire header, pushes the whole page down versus pushing just the logo and menu bar down, overlapping the page content.</div>

    <xen:include template="logo_block" />
    <xen:include template="navigation" />
    <xen:if is="{$canSearch}"><xen:include template="search_bar" /></xen:if>
</div>
</xen:hook>

As I stated within the code, if I add a div with content in it, it pushes the logo and menu bar down, which causes it to overlap the page content. I have a use for an 80px tall bar across the top, above the header itself if possible. I want the actual site to begin directly after the bar. I know this is something simple with css but it is eluding me and I am frustrated. lol

 

[iguanairs]

I can do it in the page_container, so I will just do that.