Forum Moderators: open
I'm a total newbie so first of all I hope this is in the right place.
I'm having some problems with a wordpress blog theme I've merged/created and knowing very little HTML/CSS/PHP its been fun but very challenging.
Anyway I have a section of code I made to try to create borders of variable height around some content. It uses a jpg of a top bar, then repeats the side pieces through teh content, finishes with a bottom bar. All this is defined 3 CSS classes (frametop, framemid and framebottom). This works great in firefox, but in IE7 the bottom bar is shifted so it starts in the middle of the screen.
Heres my code (I include it from the middle section in case its making a difference...)
<!-- end top -->
<div id="framemid" class="framemid">
<div id="poll" class="narrowcolumn">
<div class="postheader">
<div class="pagetitle" align="center">
<br />
<br />
<h2>TEXT</h2>
</div>
</div>
<div class="postcontent">
<div style="position: relative; top: 4px; font-size: 14px;" align="center">TEXT
</div>
</div>
<div style="position: relative; top: 30px; margin-bottom: 50px;">
<table width="60%" style="width: 55%;" align="center">
<tbody>
<tr>
<td width="50%" align="center">
<a class="greenbutton" href="LINK1">TEXT</a>
</td>
<td width="50%" align="center">
<a class="redbutton" href="LINK2">TEXT</a>
</td>
</tr>
</tbody>
</table>
</div>
<p>
<div align="center" style="position: relative; top: 5px;"><a href="LINK3"><img src="/demo.jpg" alt="demo" title="demo" class="alignnone size-full wp-image-283" width="560" height="250"></a>
<br /> <p />
<br /> <p />
<br /> <p />
</div>
</div>
</div>
<!-- bottom -->
<div id="framebottom" class="framebottom">
<div id="poll" class="narrowcolumn">
<div class="postheader">
<div class="pagetitle" align="center">
<br />
</div>
</div>
</div>
</div>
<!-- end of bottom -->
I'd really appreciate any advice on how to sort this on IE. Also I hope im giving enough info, If not please let me know and Ill post some of my CSS if its necessary (I have no idea lol).
Thanks a lot.
Sam
