NEWBIE - Need help fixing alignment and NOWRAP

Here is my html file
http://pcs1.net/tmpTask.html

I need the columns to allign and the text should not wrap. so if the text is longer then the column it should just be cut off.
ztekAsked:
Who is Participating?
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

reinisCommented:
Your columns aren't aligning with your headers partly because you are using borders with the headers. But the easiest way to make them align is to do the whole thing in one table rather than two separate tables (one for the header and one for the data). If you join the tables, this will automatically make the tables align.

Hope this helps!

Rei.
GrandSchtroumpfCommented:
By default, tables "optimize" the cells dimensions based on the content.
To get better control on tables, you need to use "table-layout: fixed":
http://www.blooberry.com/indexdot/css/properties/table/tlayout.htm

So, adding this to your stylesheet solves the problem in FF (did not test in in other browsers):

table {
  table-layout: fixed;
}
flow79Commented:
a basic table layout (with a head) should look like:

<table summary="">
  <thead>
    <tr>
      <th>Heading 1</th>
      <th>Heading 2</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>C1 R1</td>
      <td>C2 R1</td>
    </tr>
    <tr>
      <td>C1 R2</td>
      <td>C2 R2</td>
    </tr>
  </tbody>
</table>
Your Guide to Achieving IT Business Success

The IT Service Excellence Tool Kit has best practices to keep your clients happy and business booming. Inside, you’ll find everything you need to increase client satisfaction and retention, become more competitive, and increase your overall success.

ztekAuthor Commented:
ok none your things helped me. Please look at the html
reinisCommented:
OK, so here's a snippet of your HTML:

315:       <td align=left style='WIDTH: 200px' nowrap><nobr>Note</nobr></td>
316:     </tr>
317:    </thead>
318:  </table>
319:</span>
320:<span class='scrollTableBody'>
321:  <table cellspacing='0' width='1000' cellpadding=0>
322:    <tbody class=tbody>
323:      <tr id='4805' width='665'>
324:        <td id='td8_4805' class='tbody2' align='left' nowrap height='16' width='20' onclick=SelectRow('4805','tbody2','Task_4805_765587')><img align=absMiddle alt='4805' border=0 height=16 src='\\pcsweb\d$\pcsprograms\boomboom\bin\Note.gif' width=16  onclick=SelectRow('4805','tbody2','Task_4805_765587')></td>

If you remove lines 318 and 321 your HTML will still work but more importantly all your cells will line up as I originally suggested.

If you do this, then remove the width attribute; so

<td id='td9_4805' class='tbody2' align='left' nowrap height='16' width='200' onclick=SelectRow('4805','tbody2','Account_765587')>Vanessa discoed on may 31st, Pls finalize account.</td>

becomes:

<td id='td9_4805' class='tbody2' align='left' nowrap height='16' onclick=SelectRow('4805','tbody2','Account_765587')>Vanessa discoed on may 31st, Pls finalize account.</td>

this will fix the issue of your lines wrapping (even though you have the nowrap attribute).

However, you will now find that the text flows outside of your cell. To correct this use this bit of CSS:
overflow: hidden

All this works with Firefox 1.0. If you are having issues using IE, there may be a workaround for it, but you'll probably have to play with the width attributes a bit more?

Hope this helps.

Rei.

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
GrandSchtroumpfCommented:
Sorry, i missed the nowrap part... i thought you just needed the cells to align.
To solve the nowrap use this:

table {
  table-layout: fixed;
}
td {
  white-space: nowrap;
  overflow: hidden;
}

here again, it's only tested in FF (editing the CSS with the "web developer toolbar").
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
HTML

From novice to tech pro — start learning today.