Page 1 of 1
three coulmns with image above two (dumb html question)
Posted: Sun Oct 21, 2007 1:05 am
by bdconnolly
dumb html question:
trying to create a three column effect and I want to put an image above the two sidebar columns.
Code: Select all
<table id="mainpane">
<tr>
<td id="content" valign="top">{$CONTENT}</td>
{if $rightSidebarElements > 0}
<td id="serendipityRightSideBar" valign="top">{serendipity_printSidebar side="right"}</td>
<td id="serendipityLeftSideBar" valign="top">{serendipity_printSidebar side="left"}</td>
{/if}
</tr>
</table>
Suggestions?
Thanks in advance.
Posted: Sun Oct 21, 2007 1:18 am
by chickens
Switch to bulletproof and use CSS
Or this should do the trick
Code: Select all
<table id="mainpane">
<tr>
<td> </td>
<td colspan=2><img src="blah.jpg" alt="blah" />
<tr>
<td id="content" valign="top">{$CONTENT}</td>
{if $rightSidebarElements > 0}
<td id="serendipityRightSideBar" valign="top">{serendipity_printSidebar side="right"}</td>
<td id="serendipityLeftSideBar" valign="top">{serendipity_printSidebar side="left"}</td>
{/if}
</tr>
</table>
Replace the image with the actual image you want to use and it should do the trick. You could also set the background to be that image if you so desire.
Posted: Sun Oct 21, 2007 1:47 am
by bdconnolly
grazie.
Posted: Sun Oct 21, 2007 3:11 am
by bdconnolly
I spoke too soon.
This basically is where I'm going:
Code: Select all
<table id="mainpane">
<tr>
<td id="content" valign="top">{$CONTENT}</td>
<td>
{if $rightSidebarElements > 0}
<table>
<tr>
<td> </td>
<td colspan=2>
</tr>
<tr>
<td id="serendipityRightSideBar" valign="top">{serendipity_printSidebar side="right"}</td>
<td id="serendipityLeftSideBar" valign="top">{serendipity_printSidebar side="left"}</td>
{/if}
</tr>
</table>
</td>
</tr>
</table>
But now above columns 2-3 on the right, there's about 40 px of empty space. How can I even out columns 1 with 2-3?
Posted: Sun Oct 21, 2007 4:17 am
by chickens
Do you have a link or screenshot of whats going on? I dont quite understand whats going on.
You are missing a </td> on the colspan section.
Posted: Sun Oct 21, 2007 4:47 am
by bdconnolly
Can't leave it up as it's a live site. How this:
-----------
column 1
======= ----------- ------------
======= column 2 column 3
Can't seem to be able to make them all even.
Posted: Sun Oct 21, 2007 8:49 am
by carl_galloway
Brian,
Let me know what you want and we can customise carl02 to your requirements. The code is entirely mine with no licensing restrictions. It's also css only, no tables.
Posted: Sun Oct 21, 2007 2:18 pm
by bdconnolly
Thank you kindly Carl. But I think I all set. Here's what I did:
Code: Select all
<table id="mainpane">
<tr>
<td id="staticpage" valign="top">{$CONTENT}</td>
<td valign="top">
{if $rightSidebarElements > 0}
<table>
<tr>
<td style="padding-left: 10px" colspan="2" valign="top">
<script type="text/javascript">rss scroller</script>
</td>
</tr>
<tr>
<td id="serendipityRightSideBar" valign="top">{serendipity_printSidebar side="right"}</td>
<td id="serendipityLeftSideBar" valign="top">{serendipity_printSidebar side="left"}</td>
</tr>
</table>
</td>
{/if}
</tr>
</table>
A little klugie maybe? It does validate and seems to render okay. Thoughts?
Posted: Sun Oct 21, 2007 2:25 pm
by carl_galloway
Seems to be exactly what you need, and if it works for you then go for it. Not sure how you plan to deal with cellpadding and cellspacing, but I recommend keeping these in the stylesheet to reduce overhead in the html.