Overlapping pngs onto a header.

  • I thought it would’ve been simple enough but my html code pretty much just breaks the site when I attempt to edit the header.php file.

    What I want to do is something like this instead of the header as it stands. The html code I ended up using was this:

    <style type="text/css">
.under
{
position:absolute;
left:0px;
top:0px;
z-index:-2;
}
.over
{
	position:absolute;
	left:480px;
	top:120px;
	z-index:-1;
}
</style>
</head>

<body>
<img src="../../../../Downloads/HCRFC_940x198_topBanner-01.jpg" width="940" height="198" class="under" id="Banner" /></a><br />

  <a href="https://www.highcountryoutfitters.com"> <img src="../Images/High Country Corporate logo [Converted].png" width="100" height="64" align="absmiddle" class="over" id="HCO"/></a>
  <a href="https://www.hcrivers.com/"><img src= width="100" height="64" style="margin-left:100px" class="over" id="HCA" /></a>
<a href="https://www.brewhousecafe.com/"><img src="../Images/BH.png" width="55" height="64" class="over" id="BH" style="margin-left:215px"/></a>
<a href="https://www.carlsberg.com"> <img src="../Images/logo_carlsberg.png" width="169" height="64" align="absleft" class="over" id="Carlsberg" style="margin-left:280px; " /></a>

<p style="margin-left:170px;"> <font size="7" color="white" face="Impact">High Country Rugby Football Club</font></p></a>

</body>
</html>

    but again, all it seems to do is break the site.

    What am I missing to turn that code into a functional html code within the confines of the WP php documents?

Viewing 5 replies - 1 through 5 (of 5 total)

  • nerdythor,

    Your code for the link with the text of “High Country Rugby Football Club” is broken. You are missing the first part of the link code.

    <p style="margin-left:170px;"> <font size="7" color="white" face="Impact">High Country Rugby Football Club</font></p>
</a>

    If you put that code in place it should be working for you.

    Hope that helps,
    Don

    Let me clarify:

    The code that I put in place above is what you have on your page now. You will need to add the

    <a href="linklocationhere">

    to the front of the code. Hoping that is clearer.

    Thread Starter nerdythor

    (@nerdythor)

    I hadn’t really bothered to link up the High Country Rugby link as I just wanted to see if the layered pngs would work. They hadn’t and in fact broke the entire site when inserted into the header.php file so I’m a bit at a loss of how to proceed from there.

    Your code is broken.

    Thread Starter nerdythor

    (@nerdythor)

    Yeah… I fixed it and it still didn’t work(displaying a hyper-linked png suspended over a header). So that isn’t the issue at all, what would I have to do in CSS or php to get this to work for WordPress?

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘Overlapping pngs onto a header.’ is closed to new replies.

Tags