TD : Width of col goes haywire when a lengthy data is inserted. Why?

Rithish

Hi folks.

A premature and redundant question maybe... But I have a TABLE
problem.

This is almost something like what I want to acheive.

-----------------------------------------
| | | | |
| Col1 | Col2 | Col3 | Col4 |
| | | | |
-----------------------------------------
| | |
| | Colspan=3 |
| | |
-----------------------------------------

And this is what I have been trying...

<HTML>
<HEAD></HEAD>
<BODY>
<TABLE BORDER=1 ALIGN="CENTER" CELLSPACING="0" WIDTH="744px" STYLE="">

<TR>
<TD WIDTH="372px" ALIGN=CENTER VALIGN=MIDDLE STYLE=""> Description of
Goods</TD>
<TD WIDTH="126px" ALIGN=CENTER VALIGN=MIDDLE STYLE="">
Quantity(Nos.)</TD>
<TD WIDTH="126px" ALIGN=CENTER VALIGN=MIDDLE STYLE=""> Rate(Rs.)</TD>
<TD WIDTH="119px" ALIGN=CENTER VALIGN=MIDDLE STYLE="">
Amount(Rs.)</TD>
</TR>

<TR>
<TD HEIGHT="200px" COLSPAN=1 ALIGN=LEFT VALIGN=TOP
STYLE="word-wrap:normal;"> This is an html test to see why the widths
of the columns go haywire when large text is input... </TD>
<TD HEIGHT="200px" COLSPAN=3 ALIGN=LEFT VALIGN=MIDDLE
STYLE="word-wrap:normal;">
This is an html test to see why the widths of the columns go haywire
when large text is input... </TD>
</TR>

</TABLE>
</BODY>
</HTML>
Right, now to my problem.. If the text in the second row is lengthy,
it wraps accordingly, however the widths of the cells go for a toss.
Why so?

I browsed through some of the earlier posts, and they happen to say
that the WIDTH attr for a <TD> is not supported.
The html is generated/rendered through an external app; hence nesting
of tables is out of the question....
This is basically for our intranet, and all systems use IE 5.5+

Anyone out there with an answer?? I hope someone will oblige.

Regards,
Rithish.

Jul 20 '05 #1

Subscribe Reply

2445

Harlan Messinger

ri*****@dacafe. com (Rithish) wrote:

Hi folks.

A premature and redundant question maybe... But I have a TABLE
problem.

This is almost something like what I want to acheive.

-----------------------------------------
| | | | |
| Col1 | Col2 | Col3 | Col4 |
| | | | |
-----------------------------------------
| | |
| | Colspan=3 |
| | |
-----------------------------------------

And this is what I have been trying...

<HTML>
<HEAD></HEAD>
<BODY>
<TABLE BORDER=1 ALIGN="CENTER" CELLSPACING="0" WIDTH="744px" STYLE="">
[first row:]<TR>
<TD WIDTH="372px" ALIGN=CENTER VALIGN=MIDDLE STYLE=""> Description of
Goods</TD> ....

[second row:]<TR>
<TD HEIGHT="200px" COLSPAN=1 ALIGN=LEFT VALIGN=TOP
STYLE="word-wrap:normal;"> This is an html test to see why the widths
of the columns go haywire when large text is input... </TD>

....

First: If in the first row you tell the browser that the table's first
column is 372 pixels wide, and then in the second row you tell it that
the first column is 200 pixels wide, what do you *expect* the poor
browser to do?

Second: The HTML "width" attribute is valid in HTML 4.01 transitional
but not in strict. As with all layout characteristics , recommended
practice is to use CSS rather than HTML attributes. The same goes for
alignment, borders, and cell spacing.

Third: The HTML "width" attribute is treated as a minimum width, not a
maximum. If the content is too large for the stated width, the actual
width will be larger than the stated width.

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

Jul 20 '05 #2

Mark Tranchant

Harlan Messinger wrote:

ri*****@dacafe. com (Rithish) wrote:

Hi folks.

A premature and redundant question maybe... But I have a TABLE
problem.

This is almost something like what I want to acheive.

-----------------------------------------
| | | | |
| Col1 | Col2 | Col3 | Col4 |
| | | | |
-----------------------------------------
| | |
| | Colspan=3 |
| | |
-----------------------------------------

And this is what I have been trying...

<HTML>
<HEAD></HEAD>
<BODY>
<TABLE BORDER=1 ALIGN="CENTER" CELLSPACING="0" WIDTH="744px" STYLE="">

[first row:]
<TR>
<TD WIDTH="372px" ALIGN=CENTER VALIGN=MIDDLE STYLE=""> Description of
Goods</TD>

...

[second row:]
<TR>
<TD HEIGHT="200px" COLSPAN=1 ALIGN=LEFT VALIGN=TOP
STYLE="word-wrap:normal;"> This is an html test to see why the widths
of the columns go haywire when large text is input... </TD>

...

First: If in the first row you tell the browser that the table's first
column is 372 pixels wide, and then in the second row you tell it that
the first column is 200 pixels wide, what do you *expect* the poor
browser to do?

It's the height that is 200px, not the width, but your point is still
valid. Given a fixed rectangular size and an arbitrary amount of text,
what can the browser do?

--
Mark.

Jul 20 '05 #3

Harlan Messinger

"Mark Tranchant" <ma**@tranchant .plus.com> wrote in message
news:_S******** *********@stone s.force9.net...

Harlan Messinger wrote:
ri*****@dacafe. com (Rithish) wrote:

Hi folks.

A premature and redundant question maybe... But I have a TABLE
problem.

This is almost something like what I want to acheive.

-----------------------------------------
| | | | |
| Col1 | Col2 | Col3 | Col4 |
| | | | |
-----------------------------------------
| | |
| | Colspan=3 |
| | |
-----------------------------------------

And this is what I have been trying...

<HTML>
<HEAD></HEAD>
<BODY>
<TABLE BORDER=1 ALIGN="CENTER" CELLSPACING="0" WIDTH="744px" STYLE="">
[first row:]
<TR>
<TD WIDTH="372px" ALIGN=CENTER VALIGN=MIDDLE STYLE=""> Description of
Goods</TD>

...

[second row:]
<TR>
<TD HEIGHT="200px" COLSPAN=1 ALIGN=LEFT VALIGN=TOP
STYLE="word-wrap:normal;"> This is an html test to see why the widths
of the columns go haywire when large text is input... </TD>

...

First: If in the first row you tell the browser that the table's first
column is 372 pixels wide, and then in the second row you tell it that
the first column is 200 pixels wide, what do you *expect* the poor
browser to do?

It's the height that is 200px, not the width,

Oops. What's the emoticon for "embarrasse d"?
but your point is still
valid. Given a fixed rectangular size and an arbitrary amount of text,
what can the browser do?

Jul 20 '05 #4

C A Upsdell

"Rithish" <ri*****@dacafe .com> wrote in message
news:fd******** *************** **@posting.goog le.com...

Hi folks.

A premature and redundant question maybe... But I have a TABLE
problem.
And this is what I have been trying...

<HTML>
<HEAD></HEAD>
<BODY>
<TABLE BORDER=1 ALIGN="CENTER" CELLSPACING="0" WIDTH="744px" STYLE="">

WIDTH="744px" is incorrect. Drop the 'px'. HTML dimensions are always in
pixels.

Also, you should specify the width in CSS as well, since browsers honour
CSS-specified widths better than HTML-specified widths. (And in CSS, note
that you do NOT drop the 'px', since CSS supports units other than pixels.

Jul 20 '05 #5

Karl Groves

"Rithish" <ri*****@dacafe .com> wrote in message
news:fd******** *************** **@posting.goog le.com...

Hi folks.

A premature and redundant question maybe... But I have a TABLE
problem.
Right, now to my problem.. If the text in the second row is lengthy,
it wraps accordingly, however the widths of the cells go for a toss.
Why so?

A table cell is a slave to its contents. That's the way it goes.

-Karl

Jul 20 '05 #6

James Moe

Rithish wrote:

<TABLE BORDER=1 ALIGN="CENTER" CELLSPACING="0" WIDTH="744px" STYLE="">

<TR>
<TD WIDTH="372px" ALIGN=CENTER VALIGN=MIDDLE STYLE=""> Description of
Goods</TD>
<TD WIDTH="126px" ALIGN=CENTER VALIGN=MIDDLE STYLE="">
Quantity(Nos.)</TD>
<TD WIDTH="126px" ALIGN=CENTER VALIGN=MIDDLE STYLE=""> Rate(Rs.)</TD>
<TD WIDTH="119px" ALIGN=CENTER VALIGN=MIDDLE STYLE="">
Amount(Rs.)</TD>
</TR>

You can use
<colgroup>
<col width="372" />
...
</colgroup>

Given the number of attributes you are using a few CSS classes would
make layout easier to develop.

--
jmm dash list at sohnen-moe dot com
(Remove .TRSPAMTR for email)

Jul 20 '05 #7

Rithish

James Moe <jm************ ***@sohnen-moe.com> wrote in message news:<cb******* ***@216.39.176. 218>...

Rithish wrote:
<TABLE BORDER=1 ALIGN="CENTER" CELLSPACING="0" WIDTH="744px" STYLE="">

<TR>
<TD WIDTH="372px" ALIGN=CENTER VALIGN=MIDDLE STYLE=""> Description of
Goods</TD>
<TD WIDTH="126px" ALIGN=CENTER VALIGN=MIDDLE STYLE="">
Quantity(Nos.)</TD>
<TD WIDTH="126px" ALIGN=CENTER VALIGN=MIDDLE STYLE=""> Rate(Rs.)</TD>
<TD WIDTH="119px" ALIGN=CENTER VALIGN=MIDDLE STYLE="">
Amount(Rs.)</TD>
</TR>

You can use
<colgroup>
<col width="372" />
...
</colgroup>

Given the number of attributes you are using a few CSS classes would
make layout easier to develop.

Right.. Thanks.. But can't it be done just with TD? I checked the
style attribute property list of TD, and "width" is not one of them.

Regards,
Rithish.

Jul 20 '05 #8

Rithish

Harlan Messinger <hm************ *******@comcast .net> wrote in message news:<96******* *************** **********@4ax. com>...

ri*****@dacafe. com (Rithish) wrote:
Hi folks.

A premature and redundant question maybe... But I have a TABLE
problem.

This is almost something like what I want to acheive.

-----------------------------------------
| | | | |
| Col1 | Col2 | Col3 | Col4 |
| | | | |

-----------------------------------------
| | |
| | Colspan=3 |
| | |
-----------------------------------------

And this is what I have been trying...

<HTML>
<HEAD></HEAD>
<BODY>
<TABLE BORDER=1 ALIGN="CENTER" CELLSPACING="0" WIDTH="744px" STYLE="">

[first row:]
<TR>
<TD WIDTH="372px" ALIGN=CENTER VALIGN=MIDDLE STYLE=""> Description of
Goods</TD>

...

[second row:]
<TR>
<TD HEIGHT="200px" COLSPAN=1 ALIGN=LEFT VALIGN=TOP
STYLE="word-wrap:normal;"> This is an html test to see why the widths
of the columns go haywire when large text is input... </TD>

...

First: If in the first row you tell the browser that the table's first
column is 372 pixels wide, and then in the second row you tell it that
the first column is 200 pixels wide, what do you *expect* the poor
browser to do?

Second: The HTML "width" attribute is valid in HTML 4.01 transitional
but not in strict. As with all layout characteristics , recommended
practice is to use CSS rather than HTML attributes. The same goes for
alignment, borders, and cell spacing.

Third: The HTML "width" attribute is treated as a minimum width, not a
maximum. If the content is too large for the stated width, the actual
width will be larger than the stated width.

Thanks Harlan.. I am still a novice at this.. I had no inkling about
the min/max characteristics of the width attribute.

Regards,
Rithish.

Jul 20 '05 #9

Steve Pugh

ri*****@dacafe. com (Rithish) wrote:

Right.. Thanks.. But can't it be done just with TD?
Doesn't matter whether you do it with <td> or with <col>; doesn't
matter whether you do it with HTML attributes or CSS - cell/column
widths are always minima unless you have table-layout: fixed;
specified for the table as a whole.
I checked the
style attribute property list of TD, and "width" is not one of them.

Then either your checking is faulty or the source you were checking is
faulty. See http://www.w3.org/TR/CSS2/visudet.html#propdef-width
"Applies to: all elements but non-replaced inline elements, table
rows, and row groups"

Steve

--
"My theories appal you, my heresies outrage you,
I never answer letters and you don't like my tie." - The Doctor

Steve Pugh <st***@pugh.net > <http://steve.pugh.net/>

Jul 20 '05 #10

Similar topics

5729

fixed width without td ?

by: Gabriel | last post by:

greetings, I want to achieve the following effect : Menu1 | Menu2 | Menu3 | Menu4 | Menu5 | I played with padding, border-width and the like and it's ok for the | . My problem is that menu1 could be longer than menu2 : Products and FAQ for example. But all lengths will be smaller than say : 800/6 (menus) pixels.

HTML / CSS

6045

DOCTYPE Strict uses "correct" box model - so why is 100% width now useless?

by: Shadow Lynx | last post by:

Consider this simple HTML: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 STRICT//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" > <head> <title>Strict kills my widths!</title> </head> <body> <table style="width:400px; table-layout:fixed;">

HTML / CSS

1293

IE 6 width 100% issues

by: ChitownE | last post by:

Hello, I'm having problems closing the gap on a page in IE6. I want the table on the right to fill 100% of the right_panel container. In IE6, there is a 2px gap on the left. When I try to set a width of 100% on the <table> or in the table class in the CSS, the table gets pushed down so it starts below the left panel content. So, the gap goes away, but now I need the table moved back up to the top of the container. Any thoughts? ...

HTML / CSS

4789

Releationship diagram goes haywire

by: Terry | last post by:

I have added some tables to the MS Access relationship diagram window (2003) and added some relationships. But after a while when I reopen the diagram some of the tables are hidden above the top of thewindow (the relationship lines appear to go way up beyond the upper scroll limit. How can I sort them out with out redoing thediagram?

Microsoft Access / VBA

3278

width of bottom-border?

by: FuzzyLogik | last post by:

By width, I don't mean weight. I have a row of <li>'s, with a bottom-border. I want the bottom-border to only go 90% of the <li> (centered) Is there any way to do this? I have it in this format: CSS: li {

HTML / CSS

2866

can fixed the table data with <td> width

by: idsanjeev | last post by:

hello guys how can fixed the table data which display if the word can not be completed in fixed table column then bareak it in new line not expend the column width like when using this table column is auto adjested with data when a word is end then goes to new line so how can adust the table data with column not with data <td width="5%">iamsanjeevkumarjhawhatsyour</td>

HTML / CSS

1953

Update the database only when new data

by: mariaz | last post by:

Hello, I am creating a project where I parse an xml page (feed from a website) in a javabean file and I insert the parsed data in a mysql database. I want this data that gets inserted into the database to be shown in my project when it deploys (the project is jsf and I am using NetBeans). What I want to ask is how can I update the data of the database only when the xml page has new data, because what happens now is that every time I refresh my...

MySQL Database

2272

Implied width of implied center column in 3 column table

by: Csaba Gabor | last post by:

I have a table with 3 rows, and two pieces of data to display in each row. However, the first element of the last two rows and the 2nd element of the 1st row are very short. This would seem to imply three columns where the first and last columns are narrow and the (implied) middle one getting the bulk of the width. <table border id=tbl> <tr><td colspan=2><nobr>This is supposed to be long</nobr></ td><td>Fred</td></tr>

HTML / CSS

24288

Getting select to properly size width

by: RichardR | last post by:

I have a webpage which has a table that contains a column with several drop down boxes (<SELECT>). The contents of the drop down boxes are dynamically populated so I have no idea what the actually width will be necessary. How do I tell the dropdown (<SELECT>) and/or column (<TD>) to automatically size itself to the greater of widest item in the dropdown, and then get the smaller dropdowns to fill the width of the column? If I specify in...

HTML / CSS

8932

Problem With Comparison Operator <=> in G++

by: Oralloy | last post by:

Hello folks, I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>". The problem is that using the GNU compilers, it seems that the internal comparison operator "<=>" tries to promote arguments from unsigned to signed. This is as boiled down as I can make it. Here is my compilation command: g++-12 -std=c++20 -Wnarrowing bit_field.cpp Here is the code in...

C / C++

8832

Maximizing Business Potential: The Nexus of Website Design and Digital Marketing

by: jinu1996 | last post by:

In today's digital age, having a compelling online presence is paramount for businesses aiming to thrive in a competitive landscape. At the heart of this digital strategy lies an intricately woven tapestry of website design and digital marketing. It's not merely about having a website; it's about crafting an immersive digital experience that captivates audiences and drives business growth. The Art of Business Website Design Your website is...

Online Marketing

8617

The easy way to turn off automatic updates for Windows 10/11

by: Hystou | last post by:

Overview: Windows 11 and 10 have less user interface control over operating system update behaviour than previous versions of Windows. In Windows 11 and 10, there is no way to turn off the Windows Update option using the Control Panel or Settings app; it automatically checks for updates and installs any it finds, whether you like it or not. For most users, this new feature is actually very convenient. If you want to control the update process,...

Windows Server

8686

Discussion: How does Zigbee compare with other wireless protocols in smart home applications?

by: tracyyun | last post by:

Dear forum friends, With the development of smart home technology, a variety of wireless communication protocols have appeared on the market, such as Zigbee, Z-Wave, Wi-Fi, Bluetooth, etc. Each protocol has its own unique characteristics and advantages, but as a user who is planning to build a smart home system, I am a bit confused by the choice of these technologies. I'm particularly interested in Zigbee because I've heard it does some...

General

6240

Access Europe - Using VBA to create a class based on a table - Wed 1 May

by: isladogs | last post by:

The next Access Europe User Group meeting will be on Wednesday 1 May 2024 starting at 18:00 UK time (6PM UTC+1) and finishing by 19:30 (7.30PM). In this session, we are pleased to welcome a new presenter, Adolph Dupré who will be discussing some powerful techniques for using class modules. He will explain when you may want to use classes instead of User Defined Types (UDT). For example, to manage the data in unbound forms. Adolph will...

Microsoft Access / VBA

4230

Trying to create a lan-to-lan vpn between two differents networks

by: TSSRALBI | last post by:

Hello I'm a network technician in training and I need your help. I am currently learning how to create and manage the different types of VPNs and I have a question about LAN-to-LAN VPNs. The last exercise I practiced was to create a LAN-to-LAN VPN between two Pfsense firewalls, by using IPSEC protocols. I succeeded, with both firewalls in the same network. But I'm wondering if it's possible to do the same thing, with 2 Pfsense firewalls...

Networking - Hardware / Configuration

4424

Windows Forms - .Net 8.0

by: adsilva | last post by:

A Windows Forms form does not have the event Unload, like VB6. What one acts like?

Visual Basic .NET

2071

How to add payments to a PHP MySQL app.

by: muto222 | last post by:

How can i add a mobile payment intergratation into php mysql website.

PHP

1821

Comprehensive Guide to Website Development in Toronto: Expert Insights from BSMN Consultancy

by: bsmnconsultancy | last post by:

In today's digital era, a well-designed website is crucial for businesses looking to succeed. Whether you're a small business owner or a large corporation in Toronto, having a strong online presence can significantly impact your brand's success. BSMN Consultancy, a leader in Website Development in Toronto offers valuable insights into creating effective websites that not only look great but also perform exceptionally well. In this comprehensive...

General