HTML :td

[Jose Lerebours]

Bruce Easton wrote:
> Jose Lerebours wrote Thursday, August 21, 2008 3:41 PM:
> 
>> What about using <div> within <td> and set the <div> to desired width?  
>> If a layer is given a fixed width,
>> it will not expand and force text to wrap.  Of course, you then have to 
>> set height: auto; for the layer so that
>> if you require too many lines, the layer expands accordingly.
>>
> 
> I don't think you need div to do that under td - I think you 
> should just be able to control from the td (let's say you 
> want a td width of 300px):
> 
> html id :td :zz "style='width:300px'" :tx "My text"
> 
> or something like that - I only use :tx so I'm not sure of the 
> fp html syntax above, so I would just write:
> 
> html id :tx "<td style='width:300px'>My text</td>"
> 
> But, of course, this only gives better control of the width 
> of the td, and does not address guaranteed breaking of text 
> after a certain number of source characters, I addressed 
> in previous post.  
> 
> 

You are right, you do not need to use layers since you could simply set 
your cell to a fixed width and get the same wrapping effect.  In the 
same token, inserting a bunch of breaks every 20 chars is going to cause 
unexpected results when browsers are set with text size larger than normal.

You may end-up with lines showing like:
This is the first
line
This is the secon
d line
This is the third
line
This is the forth
line

because the cell wraps and it breaks the line and the line breaks again 
as per the <br> tag.

I rather use a fix width within a container, control that container 
properties using CSS and know that text will show nicely within the 
container.

Take these two samples:

<table width="100%" border="1" cellpadding="0" cellspacing="0">
	<tr>
		<td width="50%" bgcolor="#00FF00"><div style="width: 135px; 
background-color: yellow; border: 1px solid black;">This is the cell 
with the division with a 135px width.  Lets see what happens if I set 
the cell to 50%.  I am expecting the div to show within a portion of the 
cell and not the entire cell across the screen.  My guess is that I have 
typed enough to proof this theory.</div></td>
		<td width="50%" bgcolor="#FFCC00">This is the 2nd coloumn!  This 
column should show vertically centered.</td>
	</tr>
</table>


and this one - same with <br /> every 20 characters

<table width="100%" border="1" cellpadding="0" cellspacing="0">
	<tr>
		<td width="50%" bgcolor="#00FF00"><div style="width: 135px; 
background-color: yellow; border: 1px solid black;">This is the cell 
wit<br />h the division with <br />a 135px width.  Lets <br />see what 
happens if <br />I set the cell to 50<br />%.  I am expecting t<br />he 
div to show within a <br />portion of the cell <br />and not the entire 
c<br />ell across the scree<br />n.  My guess is that<br /> I have typed 
enough <br />to proof this theory<br />.</div></td>
		<td width="50%" bgcolor="#FFCC00">This is the 2nd coloumn!  This 
column should show vertically centered.</td>
	</tr>
</table>


Load this on your browser.  You will immediately notice a problem with 
using <br />.  Now increase and decrease your browser's text size and 
your PC resolution settings.

As you can see, using <br /> is not a good design practice.


--
Jose Lerebours