Help needed in adjusting the colum width of table

Hi List,
I am having two table one after the another.Even after setting the column width of both the tables the column takes the width of the data in that column.
Ideally I want both the table's column width to be same so that one cannot see that it's actually two tables.

<table border="1" cellspacing="3" cellpadding="5">
<tr>
<td align="center" width="10">Text1</td>
<td align="center" width="10">Text2</td>
<td align="center" width="10">Text3</td>
<td align="center" width="10">Text4</td>
</tr>
</table>
<table border="1" cellspacing="3" cellpadding="5">
<tr>
<td align="center" width="10">Text5</td>
<td align="center" width="10">Text6</td>
<td align="center" width="10">Text7</td>
<td align="center" width="10">Text8</td>
</tr>
</table>

It looks foolish but that's the way I want it :-)
The above stuff is not working.
Why is that the column is taking the width of the data contained in it?

Thanks in advance,
Hussain.

Jan 30 '07 #1

Subscribe Post Reply

8423

AricC

1,892

Expert 1GB

Hi Hussain welcome to The Scripts Developer Network (TSDN) try this out, please let us know if you have trouble, don't understand, or have other questions:
[html]
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Test</title>
<style type="text/css">

</style>
</head>

<body>
<table border="1" cellspacing="3" cellpadding="5">
<tr>
<td align="center" style="width: 150px">Text1</td>
<td align="center" style="width: 150px">Text2</td>
<td align="center" style="width: 150px">Text3</td>
<td align="center" style="width: 150px">Text4</td>
</tr>
</table>
<table border="1" cellspacing="3" cellpadding="5">
<tr>
<td align="center" style="width: 150px">Text5</td>
<td align="center" style="width: 150px">Text6</td>
<td align="center" style="width: 150px">Text7</td>
<td align="center" style="width: 150px">Text8</td>
</tr>
</table>

</body>
</html>
[/html]

Jan 30 '07 #2

hussain123

Hi AricC,
When I increase the length of the text then it doesn't fit into that width rather it extends the width untill it fits into it.I tried using "WORD-WRAP :break-word" still it didn't worked out.
Sample Example:-

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Test</title>
<style type="text/css">
</style>
</head>
<body>
<table border="1" cellspacing="3" cellpadding="5">
<tr>
<td align="center" style="width: 150px; WORD-WRAP :break-word" >Textqqqqqqqqqqqqqqqqqqqqqqqqqqq</td>
<td align="center" style="width: 150px; WORD-WRAP :break-word" >Text2</td>
<td align="center" style="width: 150px; WORD-WRAP :break-word" >Text3</td>
<td align="center" style="width: 150px; WORD-WRAP :break-word" >Text4</td>
</tr> </table>

<table border="1" cellspacing="3" cellpadding="5">
<tr>
<td align="center" style="width: 150px; WORD-WRAP :break-word" >Text5</td>
<td align="center" style="width: 150px; WORD-WRAP :break-word" >Text6</td>
<td align="center" style="width: 150px; WORD-WRAP :break-word" >Text7</td>
<td align="center" style="width: 150px; WORD-WRAP :break-word" >Text8</td>
</tr>

</table>
</body>
</html>

Thanks in advance,
Hussain.

Jan 31 '07 #3

AricC

1,892

Expert 1GB

Hi AricC,
When I increase the length of the text then it doesn't fit into that width rather it extends the width untill it fits into it.I tried using "WORD-WRAP :break-word" still it didn't worked out.
Sample Example:-

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Test</title>
<style type="text/css">
</style>
</head>
<body>
<table border="1" cellspacing="3" cellpadding="5">
<tr>
<td align="center" style="width: 150px; WORD-WRAP :break-word" >Textqqqqqqqqqqqqqqqqqqqqqqqqqqq</td>
<td align="center" style="width: 150px; WORD-WRAP :break-word" >Text2</td>
<td align="center" style="width: 150px; WORD-WRAP :break-word" >Text3</td>
<td align="center" style="width: 150px; WORD-WRAP :break-word" >Text4</td>
</tr> </table>

<table border="1" cellspacing="3" cellpadding="5">
<tr>
<td align="center" style="width: 150px; WORD-WRAP :break-word" >Text5</td>
<td align="center" style="width: 150px; WORD-WRAP :break-word" >Text6</td>
<td align="center" style="width: 150px; WORD-WRAP :break-word" >Text7</td>
<td align="center" style="width: 150px; WORD-WRAP :break-word" >Text8</td>
</tr>

</table>
</body>
</html>

Thanks in advance,
Hussain.

Are you trying to get the text to stay on 1 line? Try nowrap

Jan 31 '07 #4

hussain123

I want the text to be adjusted inside the 150px width(i.e now the long text will appear in two lines), but somehow it is extending that specified width by 5 pixels.
That means the two rows of the first column are not perfectly aligned.

Hussain.

Jan 31 '07 #5

AricC

1,892

Expert 1GB

Use overflow: auto see if that helps. Also, I may be missing what you are trying to do if that doesn't do it give us an example please.

HTH,
Aric

Jan 31 '07 #6

hussain123

My point is that the two table(i.e their columns and rows) should be perfectly aligned with each other irrespective of the length of the text contained in the cell of each row/column.
But now what's happening is that when the length of the text is greater than 150px it wraps to the next line(that's fine), but now this cell extends it's width little more than 150px due to which it is now NOT aligned with the cell just below it which is 150px in length.

In simple words, both the tables first column are not aligned.
Tried "overflow :auto" but didn't help :-(

hussain.

Feb 1 '07 #7

ismailc

200

100+

My point is that the two table(i.e their columns and rows) should be perfectly aligned with each other irrespective of the length of the text contained in the cell of each row/column.
But now what's happening is that when the length of the text is greater than 150px it wraps to the next line(that's fine), but now this cell extends it's width little more than 150px due to which it is now NOT aligned with the cell just below it which is 150px in length.

In simple words, both the tables first column are not aligned.
Tried "overflow :auto" but didn't help :-(

hussain.

Hi, Did you manage to get a solution as I'm sitting with the same problem.
Any Ideas?

Apr 19 '07 #8

meworkingman

This should do the trick for you:

[HTML]
<table size='150' border='1' cellpadding='0' cellspacing='0'>
<tr>
<td width='50'>Cell One</td>
<td width='50'>Cell Two</td>
<td width='50'>
<div style='overflow:hidden'>
VerryLongTextCellThatShouldWrapButWillNotLongLongL ongLongLong
</div>
</td>
</tr>
</table>
[/HTML]

This will clip the text so that it doesn't show. If you want to be able to have a scrollbar in the cell so that the user can scroll and see the entire text, change 'hidden' to 'auto'.

Note: When I test this, it works in FireFox but not in IE. I'm not sure why. Maybe because IE sucks. ;-)

Apr 20 '07 #9

Similar topics

Help Please :)

by: Kurt A. Kaylor | last post by:

Hey, I am trying to get some code I have written to work. Runs well until I make a request. The I get some problems with PHP related to an SQL statement. Here are the errors :Warning:...

PHP

Help and optimization hints, anyone?

by: Kim Petersen | last post by:

I've worked on this table object a bit too long - and seem to have stared too long at the code. Can someone see where it goes wrong in the insertrow function? Also optimization hints and...

Python

Help with a default page

by: Goober | last post by:

I have the following default.aspx page that works properly. However, what I want to do is to link the graphics within it (that are hard coded now in the default web page) to our corporate...

ASP.NET

Desperate help needed on tables in .php

by: Ladysniper | last post by:

DESPERATE doesn't begin to describe it. Can someone PLEASE tell me what is WRONG with this code? Now..a bit of background. It is a search results page for http://www.azsoma.info/directory.htm....

PHP

password simple fix help

by: prophet | last post by:

I know that this is going to be so simple to fix, but I have been pulling my hair out trying to see the forest through the trees...... What I want to do is change the onMouseOver so that when you...

Javascript

Easy for you, Difficult for me: Help a school

by: n | last post by:

Hello! Here is a problem I hope you can point me to a solution. It Problem: A teacher needs to know which lesson to teach. A school has a curriculum with 26 lessons, A-Z. For a given class,...

Microsoft Access / VBA

Please help with correct paging links

by: osward | last post by:

Hi, everyone, I had managed to make use of the date link from a simple calendar script to my query table. When I click on the date's link or Prev and Next Month link, The table first row will be...

PHP

DataGridView - Vertical ScrollBar Help Needed

by: Tom | last post by:

First, I posted a similar request for help in another group and now don't find the posting. Problem with my newsreader perhaps ... but apologies if this appears as a cross posting. My code is...

C# / C Sharp

Validation help

by: lilbit02 | last post by:

Hi, I have a form that utilizes validation as most do via javascript. This form worked totaly fine until I needed to add a dynamic div now the validation doesn't work. It does work for the first...

Javascript

Please help, simple form display problems in IE

by: jeddiki | last post by:

Hello, I have made a nice opt-in form and tested it in Moz FF and it looks fine. But in IE the elements don't line up properly. I think I am nearly there but can not get these elements...

HTML / CSS

Wordpress or something else?

by: Faith0G | last post by:

I am starting a new it consulting business and it's been a while since I setup a new website. Is wordpress still the best web based software for hosting a 5 page website? The webpages will be...

Content Management Systems

Access Europe: Command bars, the Access Shortcut Tool and a simple Audit Log - Wed 3 April

by: isladogs | last post by:

The next Access Europe User Group meeting will be on Wednesday 3 Apr 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 former...

General

How to turn on java script in a villaon keypad mobile phone

by: Charles Arthur | last post by:

How do i turn on java script on a villaon, callus and itel keypad mobile phone

Java

Basic Javascript concepts

by: aa123db | last post by:

Variable and constants Use var or let for variables and const fror constants. Var foo ='bar'; Let foo ='bar';const baz ='bar'; Functions function $name$ ($parameters$) { } ...

Javascript

Batch import of multiple excel files into the database

by: ryjfgjl | last post by:

If we have dozens or hundreds of excel to import into the database, if we use the excel import function provided by database editors such as navicat, it will be extremely tedious and time-consuming...

Data Management

Merging data from multiple Excel files

by: ryjfgjl | last post by:

In our work, we often receive Excel tables with data in the same format. If we want to analyze these data, it can be difficult to analyze them because the data is spread across multiple Excel files...

Data Management

Navigating the Data Structures and Algorithms (DSA)

by: BarryA | last post by:

What are the essential steps and strategies outlined in the Data Structures and Algorithms (DSA) roadmap for aspiring data scientists? How can individuals effectively utilize this roadmap to progress...

Algorithms / Advanced Math

Looking to do Android software development, any suggestions? Is flutter better?

by: nemocccc | last post by:

hello, everyone, I want to develop a software for my android phone for daily needs, any suggestions?

General

Is that possible of reading the .csv file in column wise and the column have different lengths ?

by: Sonnysonu | last post by:

This is the data of csv file 1 2 3 1 2 3 1 2 3 1 2 3 2 3 2 3 3 the lengths should be different i have to store the data by column-wise with in the specific length. suppose the i have to...

C / C++