106 lines
3.2 KiB
CSS
106 lines
3.2 KiB
CSS
/*Taken from:
|
|
http://www.imaputz.com/cssStuff/bigFourVersion.html
|
|
*/
|
|
|
|
/* define height and width of scrollable area. Add 16px to width for scrollbar */
|
|
div.tableContainer {
|
|
clear: both;
|
|
/*border: 1px solid #963;*/
|
|
height: 285px;
|
|
overflow: auto;
|
|
width: 756px;
|
|
}
|
|
|
|
/* Reset overflow value to hidden for all non-IE browsers. */
|
|
html>body div.tableContainer {
|
|
overflow: hidden;
|
|
width: 756px
|
|
}
|
|
|
|
/* define width of table. IE browsers only */
|
|
div.tableContainer table {
|
|
float: left;
|
|
width: 740px;
|
|
}
|
|
|
|
/* define width of table. Add 16px to width for scrollbar. */
|
|
/* All other non-IE browsers. */
|
|
html>body div.tableContainer table {
|
|
width: 756px
|
|
}
|
|
|
|
/* set table header to a fixed position. WinIE 6.x only */
|
|
/* In WinIE 6.x, any element with a position property set to relative and is a child of */
|
|
/* an element that has an overflow property set, the relative value translates into fixed. */
|
|
/* Ex: parent element DIV with a class of tableContainer has an overflow property set to auto */
|
|
thead.fixedHeader tr {
|
|
position: relative
|
|
}
|
|
|
|
/* set THEAD element to have block level attributes. All other non-IE browsers */
|
|
/* this enables overflow to work on TBODY element. All other non-IE, non-Mozilla browsers */
|
|
html>body thead.fixedHeader tr {
|
|
display: block
|
|
}
|
|
|
|
/* define the table content to be scrollable */
|
|
/* set TBODY element to have block level attributes. All other non-IE browsers */
|
|
/* this enables overflow to work on TBODY element. All other non-IE, non-Mozilla browsers */
|
|
/* induced side effect is that child TDs no longer accept width: auto */
|
|
html>body tbody.scrollContent {
|
|
display: block;
|
|
height: 262px;
|
|
overflow: auto;
|
|
width: 100%
|
|
}
|
|
|
|
/* make TD elements pretty. Provide alternating classes for striping the table */
|
|
/* http://www.alistapart.com/articles/zebratables/ */
|
|
tbody.scrollContent td, tbody.scrollContent tr.normalRow td {
|
|
/*background: #FFF;*/
|
|
|
|
border-bottom: none;
|
|
border-left: none;
|
|
/*border-right: 1px solid #CCC;
|
|
border-top: 1px solid #DDD;*/
|
|
padding: 2px 3px 3px 4px
|
|
}
|
|
|
|
tbody.scrollContent tr.alternateRow td {
|
|
/*background: #EEE;*/
|
|
border-bottom: none;
|
|
border-left: none;
|
|
/*border-right: 1px solid #CCC;
|
|
border-top: 1px solid #DDD;*/
|
|
padding: 2px 3px 3px 4px
|
|
}
|
|
|
|
/* define width of TH elements: 1st, 2nd, and 3rd respectively. */
|
|
/* Add 16px to last TH for scrollbar padding. All other non-IE browsers. */
|
|
/* http://www.w3.org/TR/REC-CSS2/selector.html#adjacent-selectors */
|
|
html>body thead.fixedHeader th {
|
|
width: 200px
|
|
}
|
|
|
|
html>body thead.fixedHeader th + th {
|
|
width: 240px
|
|
}
|
|
|
|
html>body thead.fixedHeader th + th + th {
|
|
width: 316px
|
|
}
|
|
|
|
/* define width of TD elements: 1st, 2nd, and 3rd respectively. */
|
|
/* All other non-IE browsers. */
|
|
/* http://www.w3.org/TR/REC-CSS2/selector.html#adjacent-selectors */
|
|
html>body tbody.scrollContent td {
|
|
width: 200px
|
|
}
|
|
|
|
html>body tbody.scrollContent td + td {
|
|
width: 240px
|
|
}
|
|
|
|
html>body tbody.scrollContent td + td + td {
|
|
width: 300px
|
|
} |