Johnny Bones Johnny Bones - 1 month ago 8
HTML Question

How do I get a table's cell to fill in completedly?

I'm using HTML and I'm trying to create a website that looks like a newspaper. When I enter the content, I want it to fill up the cells completely, like a newspaper's columns do. This means that some text will have to stretch a little since not every row of text will have the exact same number of characters.

Is there any way to do this in code, or am I going to have to count characters and hyphenate some words (which I'd hate to do)?

Here's the table I have:

<table border=1 width=1200 cellspacing=6>
<tr>
<td width=220>
</td>
<td width=180>
</td>
<td width=400>
</td>
<td width=180>
</td>
<td width=220>
</td>
</tr>
<tr>
<td colspan=5 height=90><img src="mackdee_header.jpg"></img>
</td>
</tr>
<tr>
<td colspan=2 align="left">Established 2014
</td>
<td align="middle">"All The News That's The Shit"
</td>
<td colspan=2 align="right">Number 69
</td>
</tr>
<tr>
<td colspan=2 height=160>Story about Jesus
</td>
<td height=120>
<div class="video-holder">
<iframe

src="http://player.vimeo.com/video/73292195" width="400" height="180"

frameborder="0" webkitAllowFullScreen mozallowfullscreen allowFullScreen>
</iframe>
</div>
</td>
<td colspan=2 height=160>Synopsis
</td>
</tr>
<tr>
<td height=150> Monologue/Joke Of The Day
</td>
<td colspan=3 height=180>Abott had Costello. Penn has Teller.

Mick - Keith. Jonny – Ed. Bonnie even had Clyde. Then how sad was this country's

perceived state of affairs that a man with a record of extensive congressional

service and unimaginable bravery and patriotism could agree to choose the Alaskan

Annie Oakley as his running mate for the most important office on earth? She

wasn't a comedic foil, a mute magician (would've been nice), an iconic rhythm

guitarist, a jovial side-kick, or even a legendary criminal. They all compliment

their partner by giving them better odds for success than not. But, the

Presidency isn't Buffalo Bill's Wild West Show, and John McCain and Sarah “Ya

Darn Tootin” Palin were soundly defeated in the 2008 election. Horrible economy;

wars; handsome, charismatic black-man: a lot to overcome - I got it. But the

pandering attempt to stimulate America's bassist gender-oriented nerve endings

didn't work. Thanks and praise to the imaginary God of (Cont'd on Page 3)
</td>
<td> About The Creators
</td height=180>
</tr>
<tr>
<td colspan=2 height=180>Monologue (Cont'd)
</td>
<td height=180>Monthly Feature
</td>
<td colspan=2 height=180>Origin (Cont'd)
</td>
</tr>
<tr>
<td colspan=2 height=80>TV Listings/Other Video
</td>
<td colspan=2 height=80>Monthly Feature (Cont'd)
</td>
<td height=80>Credits / Photos
</td>
</tr>
</table>

Answer

Probably the easiest way to design a "newpaper-like" page is through the use of justified text and columns.

This can be done pretty easily with CSS, like so:

div {
    -webkit-columns: 200px 3; /* Chrome, Safari, Opera */
    -moz-columns: 200px 3; /* Firefox */
    columns: 200px 3;
}
p{
    text-align:justify;
}

With the following style of text:

<div>
 <p>Lorem...</p>
 <p>Lorem...</p>
 <p>Lorem...</p>
 <p>Lorem...</p>
</div>

Gives you a lay out like so:

enter image description here

Credits for ipsum to CorporateIpsum (tm)