Search the Community

hi there, i have implemented a scrolling tbody for a css loaded dynamic table. the results i have saved - can be viewed at http://www.performatix.co/Customer%20Counts.htm, but what descriptors need to be added to the css to stretch the scrollable tbody as wide as the thead? (100%) the css used sofar is as follows: /* define height and width of scrollable area. Add 16px to width for scrollbar *//* allow WinIE to scale 100% width of browser by not defining a width *//* WARNING: applying a background here may cause problems with scrolling in WinIE 5.x */div.tableContainer { clear: both; border: 1px outset #808080; height: 500px; overflow: auto; width: 100%;}html div.tableContainer/* */ { padding: 0 16px 0 0; width: 100%;}html>body div.tableContainer { height: 467px; padding: 0;}head:first-child+body div[class].tableContainer { width: 97%; height: 467px; overflow: hidden;}div.tableContainer table { float: left; width: 100%}html div.tableContainer table/* */ { margin: 0 -16px 0 0;}html>body div.tableContainer table { float: none; margin: 0; width: 100%;}head:first-child+body div[class].tableContainer table { width: 100%;}thead.fixedHeader tr { position: relative; width: 100%; top: expression(document.getElementById("tableContainer").scrollTop);} */head:first-child+body thead[class].fixedHeader tr { display: block; width: 100%;}thead.fixedHeader th { background: #d8d8d8; font-weight: normal; padding: 4px 3px; text-align: left;}head:first-child+body tbody[class].scrollContent { display: block; width: 100%; height: 400px; overflow: auto;}tbody.scrollContent td, tbody.scrollContent tr.normalRow td { background-color: #f8f8f8; border-bottom: none; border-left: none; border-right: 1px solid #d8d8d8; border-top: none; padding: 2px 3px 2px 3px;}tbody.scrollContent tr.normalRow td + td + td + td + td + td { background-color: #f8f8f8; border-bottom: none; border-left: none; border-right: none; border-top: none; padding: 2px 3px 2px 3px;}tbody.scrollContent tr.alternateRow td { background-color: #d8d8d8; border-bottom: none; border-left: none; border-right: 1px solid #f8f8f8; border-top: none; padding: 2px 3px 2px 3px;}tbody.scrollContent tr.alternateRow td + td + td + td + td + td { background-color: #d8d8d8; border-bottom: none; border-left: none; border-right: none; border-top: none; padding: 2px 3px 2px 3px;}head:first-child+body thead[class].fixedHeader th { border-right: none; padding: 2px 4px 2px 4px;}head:first-child+body thead[class].fixedHeader th[title=EXECUTE], head:first-child+body thead[class].fixedHeader th[title=RESET] { width: 50%;};head:first-child+body tbody[class].scrollContent td { border-right: none; padding: 2px 4px 2px 4px;}#form_services thead.fixedHead { margin-top: 2px; margin-bottom: 2px; width: 100%;}#form_services tbody.scrollContent { width: 100%; height: 350px; overflow-y: scroll; background: #d8d8d8;}#form_transactions input[type="button"]#button_preview, #form_transactions input[type="button"]#button_sendcontact, #form_transactions input[type="button"]#button_sendaccmgr, #form_transactions input[type="button"]#button_sendsvcmgr, #form_transactions input[type="button"]#button_refresh { width: 19.22%;}#form_services input[type="button"]#title_service, #form_services input[type="button"]#title_country, #form_services input[type="button"]#title_region, #form_services input[type="button"]#title_supplier, #form_services input[type="button"]#title_status, #form_services input[type="button"]#title_primattval, #form_services input[type="button"]#group_service, #form_services input[type="button"]#group_country, #form_services input[type="button"]#group_region, #form_services input[type="button"]#group_supplier, #form_services input[type="button"]#group_status, #form_services input[type="button"]#group_primattval, #form_services input[type="button"]#execute_query, #form_services input[type="button"]#reset_query { width: 100%;}#form_services select#where_service, #form_services select#where_country, #form_services select#where_region, #form_services select#where_supplier, #form_services select#where_status, #form_services select#where_primattval { width: 98%; margin-top: 1px; margin-left: 1%;} the html is an excerpt of the dhtml populated mysql table from a select. my last two posts (one and more accurately two) were on this functionality. this is highly important to resolve, got lots of other php work to do!

i have a color error about the tables. i dont know when it comes to put the color using the CSS text "tbody {color:blue;}", im setting it at the same order as the page has gives.. except for tfoot and tbody.. i switched their orders, but what im trying to figure out.. is why the tbody element affects the color of the whole script.. when its set.. the whole text of the html page changes to the element's color, in this case.. blue. i want to know why it happens.. how to fix this bug or error scripting... this is the example tag that the page gives.http://www.w3schools...s/tag_thead.asp and ill put the file of my scripting... i have all the tables examples in a single html file with my comments.. the comments are in spanish.. tablas.html

According to the "HTML Elements and Valid Doctypes" page at "http://www.w3schools...ef_html_dtd.asp", the tags like 'thead', 'tbody', 'col', 'del', 'ins' are invalid for XHTML 1.1. But when I checked with the official DTD at "http://www.w3.org/TR...DTD/xhtml11.dtd", they all look properly included and valid elements for the xhtml1.1. I know that there are two versions of table modules supported by XHTML1.1 specification: one with 'thead', 'tbody', 'col' and another one without them(whick is called "Basic Table Module" if anyone cares). But I think the official DTD uses the one with those tags, not the one without them. The edit module which includes 'del' and 'ins' elements seems to be include at the official DTD as well. (I think there are several more tags with the mis-matching validity like above, but I am too lazy to list them all) It's very confusing