By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
440,130 Members | 2,100 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 440,130 IT Pros & Developers. It's quick & easy.

how to: a dynamic td width between static td widths?

P: n/a
23s
Given the following table structure,

<table width=100%>
<tr>
<td>static</td>
<td>static</td>
<td>variable</td>
<td>static</td>
</tr>
</table>

I want opinions on how you'd assign width values to meet the following
criteria:

The first 2 cells of the table, as well as the last cell, need to maintain a
static width of [somevalue]... let's say 200px. The content within these
"static width" cells is guaranteed to never exceed, nor reach, 200px.

The 3rd cell containing the text 'variable' needs to span whatever space
remains between the first 2 and last cell of the table. So given the
table's overall width is "100%", spanning a horizontal vieable area of
850px, in this case the variable cell would need to end up at 250px, or
about 29%.

The way I accomplish this currently is through a brute-force implementation
of a 1x1 pixel of binary transparency streatched to 1 x 200 and inserted
just after the text in the cell, and then instructing the 3rd cell to have
a greater width than I know will ever be possible. So I end up with these
"opposing forces" pushing against each other, filling out the space as
intended:

<table width=100%>
<tr>
<td>static<br><img src=spacer.gif width=200 height=1></td>
<td>static<br><img src=spacer.gif width=200 height=1></td>
<td width=100%>variable</td>
<td>static<br><img src=spacer.gif width=200 height=1></td>
</tr>
</table>

Unfortuantely... and I think it's ie 5 for mac (can't remember) but one of
my clients can see those transparent gifs, and while it's not a total deal
breaker it's a bit of a turn-off for me. So I'd like to get rid of the
gifs, if I can. What other methods can I implement to accomplish this goal?
Jul 23 '05 #1
Share this Question
Share on Google+
2 Replies


P: n/a
23s wrote:
Given the following table structure,

<table width=100%>
<tr>
<td>static</td>
<td>static</td>
<td>variable</td>
<td>static</td>
</tr>
</table>

I want opinions on how you'd assign width values to meet the following
criteria:

The first 2 cells of the table, as well as the last cell, need to maintain
a
static width of [somevalue]... let's say 200px. The content within these
"static width" cells is guaranteed to never exceed, nor reach, 200px.

The 3rd cell containing the text 'variable' needs to span whatever space
remains between the first 2 and last cell of the table. So given the
table's overall width is "100%", spanning a horizontal vieable area of
850px, in this case the variable cell would need to end up at 250px, or
about 29%.

The way I accomplish this currently is through a brute-force
implementation of a 1x1 pixel of binary transparency streatched to 1 x 200
and inserted
just after the text in the cell, and then instructing the 3rd cell to
have
a greater width than I know will ever be possible. So I end up with these
"opposing forces" pushing against each other, filling out the space as
intended:

<table width=100%>
<tr>
<td>static<br><img src=spacer.gif width=200 height=1></td>
<td>static<br><img src=spacer.gif width=200 height=1></td>
<td width=100%>variable</td>
<td>static<br><img src=spacer.gif width=200 height=1></td>
</tr>
</table>

Unfortuantely... and I think it's ie 5 for mac (can't remember) but one of
my clients can see those transparent gifs, and while it's not a total deal
breaker it's a bit of a turn-off for me. So I'd like to get rid of the
gifs, if I can. What other methods can I implement to accomplish this
goal?


try this

<table style='width:100%'>
****<tr>
********<td style='width:200px"></td>
********<td style='width:200px"></td>
********<td></td>
********<td style='width:200px"></td>
****</tr>
</table>

Jul 23 '05 #2

P: n/a
23s

"vegas_t" <ve*****@att.net> wrote in message
news:Oh********************@bgtnsc05-news.ops.worldnet.att.net...
try this

<table style='width:100%'>
<tr>
<td style='width:200px"></td>
<td style='width:200px"></td>
<td></td>
<td style='width:200px"></td>
</tr>
</table>


This accomplishes the task cleanly if the table width is large enough to
accomodate the 3 static cells; i.e. the vieable area of the browser is at
least 600px wide, and the table is allowed to span at least that much
horizontal distance.

In a scenario where the overall table width is less than 600px, the "static"
cells will begin to compromise their 200px style and collapse... I guess
because table width overrides cell width in some hierarchy of layout logic
(IE 6).

If that's the case, then ultimately I would need one of 2 theoretical
properties for the table. Either a table width value of "100%, minimum
600px", or, a property that would indicate "cell width is to take priority
over table width, but only in the event table width threatens to compromise
cell width". Unfortuantely I've never heard of either of those things.
Jul 23 '05 #3

This discussion thread is closed

Replies have been disabled for this discussion.