Hi all,<br />
I have a website that uses PHP to get text values from a DB. It then uses javascript<br />
to dynamically alter pulldown menus, populating them with these text values. However<br />
I can't trust the DB to only give me text values that fit within my table, so I want to hardcode<br />
the cell widths inside my table, so regardless of text length, cell 1 is 10% of the table, or 100<br />
pixels, or whatever. Unfortunately, if the text length is greater than this minimum, all Hell<br />
breaks lose and it's rendered horribly.<br />
<br />
Is there a way to say "regardless of this text length, never make this cell bigger than 100<br />
pixels"? I've even tried putting an entire table within <td></td> with a static pixel width<br />
with no luck.<br />
<br />
This is an example of what I'm talking about:<br />
<br />
<br />
<br />
<body><br />
<form action="stacked.php?attr=.........." method="get"><br />
<br />
<table width="800" cellpadding=4 cellspacing=0 border=1 rules=all><br />
<tbody><br />
<tr><br />
<br />
<td colspan=1><br />
<select name="host" onChange="updateSites(this.form, 0, this.selectedIndex-1)"><br />
<option selected disabled value="spacekeeper">Please choose a host</option><br />
<option value="ABC">If this string is too long I'm screwed!</option><br />
</select><br />
</td><br />
<br />
<td colspan=1><br />
<select name="site" onChange="updateTables(this.form, 0, this.selectedIndex-1)"><br />
<option selected disabled value="spacekeeper">Or if this one is too long the length is resized, pushing everything all over the place messing up alignment, et cetera!</option><br />
</select><br />
</td><br />
<br />
</tr><br />
</tbody><br />
</table><br />
<br />
</form><br />
</body><br />
<br />
<br />
<br />
When the user selects a menu option, javascript rebuilds the next menu, and resizes the cell. <br />
I can post the javascript but I think it's an HTML TABLE misunderstanding on my part. For <br />
example, I could just copy $MAX number of chars from the DB text string into the select option <br />
and pad smaller values with blanks to guarantee all text values are the same size, but this <br />
seems horrendous to me.<br />
<br />
I know everyone here prefers CSS to tables, but I want to learn basic HTML before jumping<br />
into CSS.<br />
<br />
Thanks for any pointers!<!--content-->Add style="width:100px;" to your select tag<!--content-->The problem with doing that is that you won't be able to read you long options text...<!--content-->Fang> Thanks!! That works great for NS<br />
and Safari, but for some reason IE 5.2.3<br />
for Mac doesn't follow that rule strictly.<br />
It still shifts things around if they<br />
exceed the pixel value.
But I didn't<br />
know about the "style=width:" thing so<br />
you gave me some new ideas. Thanks!<br />
<br />
pyro> I know but what else can I do?<br />
Shrink the font? Have the user scroll left<br />
and right? Include a popup ballon? I'm<br />
not sure what the nicest thing for the<br />
user is. In reality we're talking about<br />
~20 chars able to be displayed and the<br />
longest reasonable text I might get is 30<br />
chars, but about 85% fall <= 20. Any<br />
tips?<!--content-->I guess as long as you can still read it from the 20 characters you can see (enough to know what the option is) it won't be a big deal, but if the users won't be able to tell what certain options are, that's not good.<!--content-->I agree. There are enough characters you can definitely make-out what option you've chosen. Plus this is a test version so I'll be able to get customer feedback before actually releasing anything so if this is a big sticking point I can rethink the overall layout or get the DB to abbreviate things like "Average" to "Ave." and help that way. Thanks for the feedback!!
<!--content-->You're welcome. Good luck, man... <!--content-->
I have a website that uses PHP to get text values from a DB. It then uses javascript<br />
to dynamically alter pulldown menus, populating them with these text values. However<br />
I can't trust the DB to only give me text values that fit within my table, so I want to hardcode<br />
the cell widths inside my table, so regardless of text length, cell 1 is 10% of the table, or 100<br />
pixels, or whatever. Unfortunately, if the text length is greater than this minimum, all Hell<br />
breaks lose and it's rendered horribly.<br />
<br />
Is there a way to say "regardless of this text length, never make this cell bigger than 100<br />
pixels"? I've even tried putting an entire table within <td></td> with a static pixel width<br />
with no luck.<br />
<br />
This is an example of what I'm talking about:<br />
<br />
<br />
<br />
<body><br />
<form action="stacked.php?attr=.........." method="get"><br />
<br />
<table width="800" cellpadding=4 cellspacing=0 border=1 rules=all><br />
<tbody><br />
<tr><br />
<br />
<td colspan=1><br />
<select name="host" onChange="updateSites(this.form, 0, this.selectedIndex-1)"><br />
<option selected disabled value="spacekeeper">Please choose a host</option><br />
<option value="ABC">If this string is too long I'm screwed!</option><br />
</select><br />
</td><br />
<br />
<td colspan=1><br />
<select name="site" onChange="updateTables(this.form, 0, this.selectedIndex-1)"><br />
<option selected disabled value="spacekeeper">Or if this one is too long the length is resized, pushing everything all over the place messing up alignment, et cetera!</option><br />
</select><br />
</td><br />
<br />
</tr><br />
</tbody><br />
</table><br />
<br />
</form><br />
</body><br />
<br />
<br />
<br />
When the user selects a menu option, javascript rebuilds the next menu, and resizes the cell. <br />
I can post the javascript but I think it's an HTML TABLE misunderstanding on my part. For <br />
example, I could just copy $MAX number of chars from the DB text string into the select option <br />
and pad smaller values with blanks to guarantee all text values are the same size, but this <br />
seems horrendous to me.<br />
<br />
I know everyone here prefers CSS to tables, but I want to learn basic HTML before jumping<br />
into CSS.<br />
<br />
Thanks for any pointers!<!--content-->Add style="width:100px;" to your select tag<!--content-->The problem with doing that is that you won't be able to read you long options text...<!--content-->Fang> Thanks!! That works great for NS<br />
and Safari, but for some reason IE 5.2.3<br />
for Mac doesn't follow that rule strictly.<br />
It still shifts things around if they<br />
exceed the pixel value.
But I didn't<br />know about the "style=width:" thing so<br />
you gave me some new ideas. Thanks!<br />
<br />
pyro> I know but what else can I do?<br />
Shrink the font? Have the user scroll left<br />
and right? Include a popup ballon? I'm<br />
not sure what the nicest thing for the<br />
user is. In reality we're talking about<br />
~20 chars able to be displayed and the<br />
longest reasonable text I might get is 30<br />
chars, but about 85% fall <= 20. Any<br />
tips?<!--content-->I guess as long as you can still read it from the 20 characters you can see (enough to know what the option is) it won't be a big deal, but if the users won't be able to tell what certain options are, that's not good.<!--content-->I agree. There are enough characters you can definitely make-out what option you've chosen. Plus this is a test version so I'll be able to get customer feedback before actually releasing anything so if this is a big sticking point I can rethink the overall layout or get the DB to abbreviate things like "Average" to "Ave." and help that way. Thanks for the feedback!!
<!--content-->You're welcome. Good luck, man... <!--content-->