HighDots Forums  

formatting the third column

Cascading Style Sheets Layout/presentation on the WWW (comp.infosystems.www.authoring.stylesheets)


Discuss formatting the third column in the Cascading Style Sheets forum.



Reply
 
Thread Tools Display Modes
  #1  
Old   
Michael Hill
 
Posts: n/a

Default formatting the third column - 07-21-2004 , 04:26 PM






I am having a problem formatting the third column. It should be 70px
wide, but it is extending well beyond 70.

The 2nd and 3rd column should be the same width. The content of the 3rd
column wraps like it is suppose to, but the width does not get fixed at
70px.

<table border="1">
<tr>
<td>
<div style="position:fixed; width:120px;">
2 - new stuff and other important stuff titles
</div>
</td>
<td>
<div style="position:fixed; width:70px; word-wrap:break-word;">
Mon 02/02/04
</div>
</td>
<td>
<div style="position:fixed; width:70px; word-wrap:break-word;">
Fri 12/31/04 kjhdfasdfadsfa andfdandsfnakdsnfaksnfdkajn
</div>
</td>
<td>
<div style="position:fixed; width:400px;">
Need to add some stuff here
</div>
</td>
</tr>
</table>

Reply With Quote
  #2  
Old   
Harlan Messinger
 
Posts: n/a

Default Re: formatting the third column - 07-21-2004 , 06:58 PM






Michael Hill <hillmw (AT) ram (DOT) lmtas.lmco.com> wrote:

Quote:
I am having a problem formatting the third column. It should be 70px
wide, but it is extending well beyond 70.

The 2nd and 3rd column should be the same width. The content of the 3rd
column wraps like it is suppose to, but the width does not get fixed at
70px.
If you set the width to 70px and then include content that's larger
than 70px, you're going to get a column that's wider than 70px. You
could try max-width, but IE6 doesn't support it.

Quote:
table border="1"
<tr
<td
<div style="position:fixed; width:120px;"
2 - new stuff and other important stuff titles
</div
</td
<td
<div style="position:fixed; width:70px; word-wrap:break-word;"
Mon 02/02/04
</div
</td
<td
<div style="position:fixed; width:70px; word-wrap:break-word;"
Fri 12/31/04 kjhdfasdfadsfa andfdandsfnakdsnfaksnfdkajn
</div
</td
<td
<div style="position:fixed; width:400px;"
Need to add some stuff here
</div
</td
</tr
/table

--
Harlan Messinger
Remove the first dot from my e-mail address.
Veuillez ๔ter le premier point de mon adresse de courriel.


Reply With Quote
  #3  
Old   
Stephen Poley
 
Posts: n/a

Default Re: formatting the third column - 07-22-2004 , 12:40 AM



On Wed, 21 Jul 2004 19:58:22 -0400, Harlan Messinger
<hmessinger.removethis (AT) comcast (DOT) net> wrote:

Quote:
Michael Hill <hillmw (AT) ram (DOT) lmtas.lmco.com> wrote:

I am having a problem formatting the third column. It should be 70px
wide, but it is extending well beyond 70.

The 2nd and 3rd column should be the same width. The content of the 3rd
column wraps like it is suppose to, but the width does not get fixed at
70px.

If you set the width to 70px and then include content that's larger
than 70px, you're going to get a column that's wider than 70px. You
could try max-width, but IE6 doesn't support it.
max-width doesn't apply to table elements anyway.

--
Stephen Poley

http://www.xs4all.nl/~sbpoley/webmatters/


Reply With Quote
  #4  
Old   
Michael Hill
 
Posts: n/a

Default Re: formatting the third column - 07-22-2004 , 09:17 AM



Harlan,

Do you have any other suggestions other than limiting my content?

Mike

Harlan Messinger wrote:
Quote:
Michael Hill <hillmw (AT) ram (DOT) lmtas.lmco.com> wrote:

I am having a problem formatting the third column. It should be 70px
wide, but it is extending well beyond 70.

The 2nd and 3rd column should be the same width. The content of the 3rd
column wraps like it is suppose to, but the width does not get fixed at
70px.

If you set the width to 70px and then include content that's larger
than 70px, you're going to get a column that's wider than 70px. You
could try max-width, but IE6 doesn't support it.


table border="1"
tr
td
div style="position:fixed; width:120px;"
2 - new stuff and other important stuff titles
/div
/td
td
div style="position:fixed; width:70px; word-wrap:break-word;"
Mon 02/02/04
/div
/td
td
div style="position:fixed; width:70px; word-wrap:break-word;"
Fri 12/31/04 kjhdfasdfadsfa andfdandsfnakdsnfaksnfdkajn
/div
/td
td
div style="position:fixed; width:400px;"
Need to add some stuff here
/div
/td
/tr
/table

--
Harlan Messinger
Remove the first dot from my e-mail address.
Veuillez ๔ter le premier point de mon adresse de courriel.

Reply With Quote
  #5  
Old   
Harlan Messinger
 
Posts: n/a

Default Re: formatting the third column - 07-22-2004 , 09:59 AM




"Michael Hill" <hillmw (AT) ram (DOT) lmtas.lmco.com> wrote

Quote:
Harlan,

Do you have any other suggestions other than limiting my content?

Well, first of all, please don't top-post, or else when your correspondent
places portions of his response the related portions of your question, the
message will fall entirely out of order, as you can see has happened here.

Second, what do you think *should* happen? Splitting a word is a last resort
for a browser, which rightly gives readability precedence over layout. And
what if it was an image instead of a word?

I thought the CSS overflow property might help, but see
http://gavelcade.com/tests/celloverflow.html. This version of the page uses
max-width: 70px; on every cell (instead of just width: 70px; which gives the
same result) but the width of the third column is *still* overridden by the
length of the long text. This is true, at least, in IE6, Firefox, and Opera.
In addition, IE makes room for the implied scrollbars in the case of
overflow: scroll.

So you may be out of luck.

Quote:
Mike

Harlan Messinger wrote:

Michael Hill <hillmw (AT) ram (DOT) lmtas.lmco.com> wrote:

I am having a problem formatting the third column. It should be 70px
wide, but it is extending well beyond 70.

The 2nd and 3rd column should be the same width. The content of the 3rd
column wraps like it is suppose to, but the width does not get fixed at
70px.

If you set the width to 70px and then include content that's larger
than 70px, you're going to get a column that's wider than 70px. You
could try max-width, but IE6 doesn't support it.


table border="1"
tr
td
div style="position:fixed; width:120px;"
2 - new stuff and other important stuff
titles
/div
/td
td
div style="position:fixed; width:70px;
word-wrap:break-word;"
Mon 02/02/04
/div
/td
td
div style="position:fixed; width:70px;
word-wrap:break-word;"
Fri 12/31/04 kjhdfasdfadsfa
andfdandsfnakdsnfaksnfdkajn
/div
/td
td
div style="position:fixed; width:400px;"
Need to add some stuff here
/div
/td
/tr
/table

--
Harlan Messinger
Remove the first dot from my e-mail address.
Veuillez ๔ter le premier point de mon adresse de courriel.


Reply With Quote
Reply




Thread Tools
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

vB code is On
Smilies are On
[IMG] code is On
HTML code is Off



Powered by vBulletin Version 3.5.4
Copyright ©2000 - 2008, Jelsoft Enterprises Ltd.