changing template size depending on content

[blah-de-blah]

I was wondering how sites like these:
http://www.absolutecross.com

Stretch their templates according to their content amount? It seems like there is an image which repeats so it makes the template look longer when there is more content.

If you don't know what i mean, go to different areas of the site, and then look at your scrollbar size. It changes, but the template looks the same, but there is more content :-\

ANyone know howta do this?? thanks!!

[abzoid]

The "trick" is done using tiled background images within table cells for the sides, top and bottom edges so that they'll expand and contract as needed.

Here's the pertinent part of the source code, cleaned up a bit to be easier to read.



<table WIDTH="310" BORDER="0" CELLPADDING="0" CELLSPACING="0" BGCOLOR="#F2F2F2">
<tr>
<td><img SRC="topleft.jpg" WIDTH="19" HEIGHT="29"></td>
<td BACKGROUND="toptile.jpg"><img SRC="topmid_left.jpg" WIDTH="22" HEIGHT="29"></td>
<td BACKGROUND="toptile.jpg" ALIGN="right"><img SRC="topmid_rt.jpg" WIDTH="109" HEIGHT="29"></td>
<td><img SRC="toprt.jpg" WIDTH="26" HEIGHT="29"></td>
</tr>
<tr>
<td BACKGROUND="sideleft.jpg" WIDTH="19">&nbsp;</td>
<td COLSPAN="2" WIDTH="100%" VALIGN="top" BGCOLOR="#F2F2F2" CLASS="smaller-content">
{text content here}
</td>
<td BACKGROUND="sidert.jpg" WIDTH="26">&nbsp;</td>
</tr>
<tr>
<td><img SRC="botleft.jpg" WIDTH="19" HEIGHT="37"></td>
<td BACKGROUND="bottile.jpg"><img SRC="botmid_left.jpg" WIDTH="22" HEIGHT="37"></td>
<td BACKGROUND="bottile.jpg" ALIGN="right"><img SRC="botmid_rt.jpg" WIDTH="109" HEIGHT="37"></td>
<td><img SRC="botrt.jpg" WIDTH="26" HEIGHT="37"></td>
</tr>
</table>

[blah-de-blah]

thanks abzoid, but just to make sure i get this right i have a couple of quesiton :)

Since i made my template in fireworks, i havta insert slices right. So where do i get the bottom tile and the top tiles? Do i just cut out the parts i want tiled, and save them seperately? thanks

[abzoid]

Right, you cut a portion of the graphic from those top and bottom edge slices so that each will tile as desired when used as a background image within the appropriate table cells.

[JMS]

My advice would be to learn dreamweaver. It makes much cleaner sites. Fireworks can make life easy but the code it generates it pretty messy.

Just use Fireworks to output your images and build the site in Dreamweaver.

But if Fireworks does it for you, stick with it i guess. Just means you'll be pretty limited in what you can do.

:)

[blah-de-blah]

Sorry sorta stopped this part for a while so couldn't really have done what i wanted.

Ok so how would you cut a portion from the graphic?? After you export the slices, they automatically each have their own names. Do i just find the right ones and then link it to the table cell? Or is there an easier way?? thanks :P

[abzoid]

Use your graphics software to cut a section from the appropriate slice that is the right height or width. You'll have to do this manually.

[blah-de-blah]

Oh i see....So theres no point making the template into slices is there??? thanks

[abzoid]

No not really, unless you need the other parts for something else you're doing with the page.

[blah-de-blah]

i'm trying that at the moment, but i have this section with links. If i save it as a gif then the buttons won't link :-\ Would it be possible to create the link later on in dreamweaver (i was hoping the buttons would have a rollOver effect)..??

[blah-de-blah]

Oh yea and is there a way just to save a certain object on the stage instead of copying and pasting it to a newpage (in fireworks). Thanks for your time :)