Penny Arcade Forums› Help / Advice Forum
The new forums will be named Coin Return (based on the most recent vote)! You can check on the status and timeline of the transition to the new forums here.
Please vote in the Forum Structure Poll. Polling will close at 2PM EST on January 21, 2025.

HTML: Properly using tables to scale my content on screen

EinEin CaliforniaRegistered User regular
edited June 2007 in Help / Advice Forum
Hey guys.

I am having a bit of trouble, and though I do not wish to sitewhore, a link is probably the best way of explaining.

http://the-warforge.com/index.pl?Blog&target=Posting%20like%20it's%201998

This is a post on my site that contains a lot of images. The problem I am having is this: The white center column's width changes depending on the resolution the site is viewed at. This means there is a significantly larger space when I view the site on my 1900x1200 monitor than when I view it on my 1024x768 one.

Up till this point, I've generally stuck with using tables to put three images side by side each line, as it's never given me trouble before. If I put too many columns there, the white center gets stretched horizontally and it ends up throwing the site off a bit.

What I'm trying to do is make it so that the site will put as many images on a single line as it can, instead of just three. I am, however, completely HTML-retarded. I basically make my posts in dreamweaver, and copy and paste the HTML into a blog system my friend set up for me. Here's an the code that post is comprised of:
<table border="0" width="100%">    <tbody><tr>      <td><p>I said I'd post these scans, and by god here they are. Hopefully this won't get me in any sort of trouble - the magazine is long out of print, and it's just such phenomenal material. If I get an e-mail from GW asking me to take it down, I shall do so gladly, but I don't honestly think this causes any harm - if anything, it should make you want to subscribe.
</p>      <p>First, the battle report, <strong>Last Stand at Glazer's Creek</strong>. I love Adrian Wood <em>so much. </em> Who else would take the time to pose roaring at his opponents for a magazine? </p></td>    </tr>  </tbody></table>  <center><table border="2" width="450">    <tbody><tr>      <td><a href="http://www.fusedcreations.com/adam/batrep1.jpg"><img src="http://www.fusedcreations.com/adam/batrep1_TH.jpg" title="Page 1" border="0" height="213" width="150"></a></td>      <td><a href="http://www.fusedcreations.com/adam/batrep2.jpg"><img src="http://www.fusedcreations.com/adam/batrep2_TH.jpg" title="Page 2" border="0" height="213" width="150"></a></td>      <td><a href="http://www.fusedcreations.com/adam/batrep3.jpg"></a><a href="http://www.fusedcreations.com/adam/batrep3.jpg"><img src="http://www.fusedcreations.com/adam/batrep3_TH.jpg" title="Page 3" border="0" height="213" width="150"></a></td>    </tr>  </tbody></table>  <table border="2" width="450">    <tbody><tr>      <td><a href="http://www.fusedcreations.com/adam/batrep4.jpg"><img src="http://www.fusedcreations.com/adam/batrep4_TH.jpg" title="Page 4" border="0" height="213" width="150"></a></td>      <td><a href="http://www.fusedcreations.com/adam/batrep5.jpg"><img src="http://www.fusedcreations.com/adam/batrep5_TH.jpg" title="Page 5" border="0" height="213" width="150"></a></td>      <td><a href="http://www.fusedcreations.com/adam/batrep6.jpg"><img src="http://www.fusedcreations.com/adam/batrep6_TH.jpg" title="Page 6" border="0" height="213" width="150"></a><a href="http://www.fusedcreations.com/adam/batrep6.jpg"></a></td>    </tr>  </tbody></table>  <table border="2" width="450">    <tbody><tr>      <td><a href="http://www.fusedcreations.com/adam/batrep7.jpg"><img src="http://www.fusedcreations.com/adam/batrep7_TH.jpg" title="Page 7" border="0" height="213" width="150"></a></td>      <td><a href="http://www.fusedcreations.com/adam/batrep8.jpg"><img src="http://www.fusedcreations.com/adam/batrep8_TH.jpg" title="Page 8" border="0" height="213" width="150"></a></td>      <td><a href="http://www.fusedcreations.com/adam/batrep9.jpg"><img src="http://www.fusedcreations.com/adam/batrep9_TH.jpg" title="Page 9" border="0" height="213" width="150"></a><a href="http://www.fusedcreations.com/adam/batrep6.jpg"></a></td>    </tr>  </tbody></table>  <table border="2" width="450">    <tbody><tr>      <td><a href="http://www.fusedcreations.com/adam/batrep10.jpg"><img src="http://www.fusedcreations.com/adam/batrep10_TH.jpg" title="Page 10" border="0" height="213" width="150"></a></td>      <td><a href="http://www.fusedcreations.com/adam/batrep11.jpg"><img src="http://www.fusedcreations.com/adam/batrep11_TH.jpg" title="Page 11" border="0" height="213" width="150"></a></td>      <td><a href="http://www.fusedcreations.com/adam/batrep12.jpg"><img src="http://www.fusedcreations.com/adam/batrep12_TH.jpg" title="Page 12" border="0" height="213" width="150"></a><a href="http://www.fusedcreations.com/adam/batrep6.jpg"></a></td>    </tr>  </tbody></table>  <table border="2" width="450">    <tbody><tr>      <td><a href="http://www.fusedcreations.com/adam/batrep13.jpg"><img src="http://www.fusedcreations.com/adam/batrep13_TH.jpg" title="Page 13" border="0" height="213" width="150"></a></td>      <td><a href="http://www.fusedcreations.com/adam/batrep14.jpg"><img src="http://www.fusedcreations.com/adam/batrep14_TH.jpg" title="Page 14" border="0" height="213" width="150"></a></td>      <td><a href="http://www.fusedcreations.com/adam/batrep15.jpg"><img src="http://www.fusedcreations.com/adam/batrep15_TH.jpg" title="Page 15" border="0" height="213" width="150"></a></td>    </tr>  </tbody></table>  <table border="2" width="300">    <tbody><tr>      <td><a href="http://www.fusedcreations.com/adam/batrep16.jpg"><img src="http://www.fusedcreations.com/adam/batrep16_TH.jpg" title="Page 16" border="0" height="213" width="150"></a></td>      <td><a href="http://www.fusedcreations.com/adam/batrep17.jpg"><img src="http://www.fusedcreations.com/adam/batrep17_TH.jpg" title="Page 17" border="0" height="213" width="150"></a></td>    </tr>  </tbody></table></center>  <table border="0" width="100%">    <tbody><tr>      <td>Following that up, I also have the scans of the Adrian Wood's Dreadnoughts. I think a lot of these parts are since out-of-production, but they're still very interesting visually. </td>    </tr>  </tbody></table><center>  <table border="2" width="450">    <tbody><tr>      <td><a href="http://www.fusedcreations.com/adam/dreadscan1.jpg"><img src="http://www.fusedcreations.com/adam/dreadscan1_TH.jpg" title="Dreadnought Scan, Page 1" border="0" height="213" width="150"></a></td>      <td><a href="http://www.fusedcreations.com/adam/dreadscan2.jpg"><img src="http://www.fusedcreations.com/adam/dreadscan2_TH.jpg" title="Dreadnought Scan, Page 2" border="0" height="213" width="150"></a><a href="http://www.fusedcreations.com/adam/batrep14.jpg"></a></td>      <td><a href="http://www.fusedcreations.com/adam/dreadscan3.jpg"><img src="http://www.fusedcreations.com/adam/dreadscan3_TH.jpg" title="Dreadnought Scan, Page 3" border="0" height="213" width="150"></a><a href="http://www.fusedcreations.com/adam/batrep15.jpg"></a></td>    </tr>  </tbody></table></center>  <table border="0" width="100%">    <tbody><tr>      <td>Ther was one last little thing I noticed while I was reading through these old magazines that I found highly entertaining. Check out the old, all-metal Thunderhawks they used to push! </td>    </tr>  </tbody></table><center>  <table border="1" width="150">    <tbody><tr>      <td><a href="http://www.fusedcreations.com/adam/thawkscan.jpg"><img src="http://www.fusedcreations.com/adam/thawkscan_TH.jpg" title="You too can bludgeon your friends with eighty pounds of pewter!" border="0" height="213" width="150"></a></td>    </tr>  </tbody></table></center>  <table border="0" width="100%">    <tbody><tr>      <td>I love these old magazines.  <img src="http://forums.penny-arcade.com/images/smilies/icon_smile.gif" height="15" width="15"> They've got such a vintage feel to them, and they don't take themselves too seriously. Might have to look into grabbing a couple more from ebay! I'd certainly recommend people <a href="http://store.us.games-workshop.com/storefront/store.us?do=List_Models&code=304300">grab a subscription to WD</a>, in any case. Just think - in ten years, you can be looking back fondly at all the <span style="font-style: italic;">current</span> stuff!  </td>    </tr>  </tbody></table>

It's a mess, I know. It's just what Dreamweaver ends up feeding me.

Basically, I want to stop using the three-column tables for everything and make it a bit more dynamic so that it'll put as many images inside the width of the white center column as can fit, as dictated by the viewer's resolution. I have no idea how to do this, so I'm hoping you guys could help me.

Ein on

Posts

Sign In or Register to comment.
Penny Arcade Forums› Help / Advice Forum