0

I'm having trouble getting some formatting to work properly. I am using a row of cells (not visible) to set the formatting for a table by listing a width for each one. (I am doing this because I have a strange setup with <div>s and <table>s mixed together to form a scrolling panel). The widths are working fine in one place, but not being respected in another. An example of the code is shown below:

<div id='am_verticalScrollerDiv' style='height: 500px; overflow-y: auto;'>
    <table id='am_verticalScrollerLayoutTable' height='100%' border='0' cellpadding='0' cellspacing='0'>
        <tr>
            <td id='am_resourceListCell'>
                <div id='am_resourceListDiv'>
                    <table id='am_resourceTitleTable' width='100%' border='0' cellpadding='0' cellspacing='0'>
                        <tr id='am_resource_tableTitleBar'></tr>
                    </table>
                </div>
                <table id='am_resourceList' width='100%' border='0' cellpadding='0' cellspacing='0'>
                    <tbody></tbody>
                </table>
            </td>
            <td id='am_horizScrollCell'>
                <div id='am_horizScrollDiv' style='width:900px; overflow-x: auto;'>
                    <div id='am_schedDataTitleBarDiv'>
                        <table id='am_schedDataTitleBarTable>
                            <tr class='am_schedule_formatBar'></tr>
                            <tr id='am_schedule_tableTitleBar'></tr>
                        </table>
                    </div>
                    <table id='am_scheduleDisplay' width='100%' border='0' cellpadding='0' cellspacing='0' style='table-layout: fixed; empty-cells: show;'>
                        <tbody></tbody>
                    </table>
                </div>
            </td>
        </tr>
    </table>
</div>

I have tried replacing the formatting rows with <colgroup>s, but no luck. It seems that the <div> am_schedDataTitleBarDiv is taking the width of am_horizScrollDiv. I have tried setting an explicit width for the former, but it still doesn't work properly. Any suggestions?

EDIT: I forgot to mention, all of the data is being built using the jQuery .html() and .append() methods, but the only relevant part is that .am_schedule_tableTitleBar is being populated with a list of empty cells with the width set to 20px, and am_schedule_tableTitleBar is being filled with several cells with colspan='7'.

xaxxon
  • 19,189
  • 5
  • 50
  • 80
Crash
  • 219
  • 6
  • 16
  • 2
    the goggles! they do nothing! – Marc B Jul 29 '13 at 18:18
  • 2
    Missing quote ``
    – PiLHA Jul 29 '13 at 18:19
  • 5
    MY EYES! B̼̟̬̭͇͈͙̘ͅL̞͙̥̺͇͖̟̥E̗̰̜̰̼̳͍̲̰̳͓͔̻E̟̳̝̲̣̼͈͎̯̼̜̤̻D̮̣̠̜̞̼̮̣̙̠̦͎!̜̖͔͓̳͇̖̣̝̤̗͖̤̤̻̲̘ On a more serious note, don't use tables for layout. See [Why not use tables for layout in HTML?](http://stackoverflow.com/q/83073) – Madara's Ghost Jul 29 '13 at 18:21
  • This seems like a good time to use tables- I am actually filling this table with data, having dates across the top and employee names down the side. I don't know of a better way to display the data. – Crash Jul 29 '13 at 18:24
  • You can use the tables for data, but you're using tables for **layout**. The `am_verticalScrollerLayoutTable` table is completely unnecessary. – Shmiddty Jul 29 '13 at 18:27
  • Ah. Well, I'd be happy to do whatever I can to make it work. The goal here is to create a table with names down the side, and on the right it is to contain a scrollable area with the data corresponding to the names, with a frozen date bar on top (similar to an Excel sheet with a row frozen on the left and top). I must be able to scroll both horizontally and vertically. – Crash Jul 29 '13 at 18:29
  • Seeing large amounts of html in table format is like cloud watching: you never know what shape you might find! – Jordan Plahn Jul 29 '13 at 18:41
  • 1
    Come on, this is getting silly. People aren't allowed to put scrollbars on tables anymore? What's next, you're going to torch people who give tables different background colors in alternative rows? Come on, get a grip; this is a correct use of a table. Giving a table a style is NOT abuse. – Mr Lister Jul 29 '13 at 19:04
  • While I appreciate the value of a debate, and I am by no means an experienced web designer and know little of proper design practices, I would ask that unless someone has a suggestion for how to better complete the task at hand, people please focus on the question rather than debating the validity of my use of tables. – Crash Jul 29 '13 at 19:29

0 Answers0