Hello, DNN community.
I recently started a new project with a friend of mine, and my task is to design the website while he will take care of the content and I found out about DotNetNuke a couple of weeks ago and I think that's exactly what we are looking for. So here I am trying to make my very first skin, I have read two manuals about it and created a working skin which I tested now, it works exactly as I intended in IE, Opera and Chrome but with Firefox I have a problem showed in this sandbox page I created for this post:
I imagine that anyone using Firefox will see that the right frame named "HorizPane" in my code where "TheFinancials" banner is now, forces the entire left side down leaving an empty space, while in other browsers the top banner is aligned on top with the right column. I browsed around the forum and I think that my problem is somehow related to
this thread but the solution used there doesn't seem to work in my case.
Here is my skin.htm code:
<p align="center">[USER] - [LOGIN]</p>
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<th colspan="3" align="left" valign="top" scope="col"><div id="BannerPane" runat="server"></div></th>
<th rowspan="4" align="left" valign="top" scope="col"><div id="HorizPane" runat="server"></div></th>
</tr>
<tr>
<td colspan="3" class="MenuContainer">[NAV]</td>
</tr>
<tr>
<td colspan="3" align="left" valign="top" ><div id="ArribaPane" runat="server"></div></td>
</tr>
<tr>
<td align="left" valign="top"><div id="IzqAPane" runat="server"></div></td>
<td align="left" valign="top"><div id="ContentPane" runat="server"></div></td>
<td align="left" valign="top"><div id="DerAPane" runat="server"></div></td>
</tr>
<tr>
<td colspan="2" align="left" valign="top"><div id="IzqBPane" runat="server"></div></td>
<td colspan="2" align="left" valign="top"><div id="DerBPane" runat="server"></div></td>
</tr>
<tr>
<td colspan="4" align="left" valign="top"><div id="AbajoPane" runat="server"></div></td>
</tr>
</table>
I'm pretty inexperienced with web design, html and css so I imagine that maybe I'm not doing the most efficient or correct thing here, and it must be a better way to achieve the exact same results working in all browsers, so any help will be highly appreciated.