how to fix the height of the rows of the display tag (table)

classic Classic list List threaded Threaded
1 message Options
Reply | Threaded
Open this post in threaded view
|

how to fix the height of the rows of the display tag (table)

sayak
hi
 i have fixed display header on display tag. But I am facing some problem when trying to display less no of data then the height of table rows are increased.i cant fixed the height of the rows of the display table.plz suggest me what should i do.
here is my css:

.dataTable {

        background-color: white;

        border: 1px solid #000066;

        font-size : 9pt;

        color: #3B4B7A;

        margin: 0px;

        width:100%;

}



.datatable tbody{

        height:353px;

        width:100%;

        overflow-x:hidden;

}



.dataTable th {

        border-right: 1px solid #c8c8ff;

        padding-left: 2px;

        padding-right:12px;

        font-family: arial, helvetica, sans-serif;

        font-weight: bold;

        color: white;

        background-color: #000066;

        margin-right: 10px;

        white-space: nowrap;

}



.dataTable  td {

        font-family: verdana, arial, helvetica, sans-serif;

        font-color: #3B4B7A;

        padding-left: 2px;

}



.dataTable tr.total td {

        white-space: nowrap;

        vertical-align: top;

        font-weight: bold;

        border-top: 1px solid black;

        padding-bottom: 10px;

}



.dataTable tr.total td.customer {

        visibility: hidden;

}



.dataTable td.hidden {

        display: none;

}



.dataTable th.hidden {

        display: none;

}



.dataTable th.r {

        text-align: right;

        padding-right: 10px;

}



.dataTable th.c {

        text-align: center;

}



.dataTable td.r {

        text-align: right;

        padding-right: 10px;

}



.dataTable td.c {

        text-align: center;

}



.dataTable  tr.odd {

        background-color: whitesmoke;

}



.dataTable tr.even {

        background-color: #d6cfe6;

}



.dataTable th a   ,.dataTable th a:visited {

        text-align: left;

        color: white;

}



.dataTable th a:hover {

        color: #ffcc00;

        background-color: transparent;

}



.dataTable .order1 {

        background-position: right;

        background-image: url(../images/arrow_up.gif);

        background-repeat: no-repeat;

}



.dataTable .order2 {

        background-position: right;

        background-image: url(../images/arrow_down.gif);

        background-repeat: no-repeat;

}



.pagelinks {

    padding: 0 19px 1px 20px;

        color: #999999;

        margin: 5px;

}



.pagelinks img {

        vertical-align: middle;

}

div.exportlinks {

        background-color: #eee;

        border: 1px dotted #999;

        padding: 2px 4px 2px 4px;

        margin: -10px 0 10px 0;

        width: 79%;

}

span.export {

        padding: 0 4px 1px 20px;

        font-size: x-small;

        text-align: center;

        display:inline; display:inline-block;

}



span.excel {

        background-image: url(../images/ico_file_excel.png);

        background-repeat: no-repeat;

        width: 16px;

}



span.csv {

        background-image: url(../images/ico_file_csv.png);

        background-repeat: no-repeat;

        width: 16px;

}



span.xml {

        background-image: url(../images/ico_file_xml.png);

        background-repeat: no-repeat;

        width: 16px;

}



span.pdf {

        background-image: url(../images/ico_file_pdf.png);

        background-repeat: no-repeat;

        width: 16px;

}



span.rtf {

        background-image: url(../images/ico_file_rtf.png);

        background-repeat: no-repeat;

        width: 16px;

}



.dataTable tr.rowMouseOver {

        background-image: url(../images/selected.gif);

        background-repeat: repeat-x;

        background-color: #ffff99;

}



html,body {

        width: 100%;

        height: 100%;

        margin: 0px;

        font-family: arial, helvetica, sans-serif;

        font-size: 9pt;

}



a:link {

        color: #000099;

        text-decoration: none;

        background-color: transparent;

        font-weight: bold;

}



a:visited {

        color: #000099;

        text-decoration: none;

        background-color: transparent;

        font-weight: bold;

}



a:hover {

        color: #d68000;

        background-color: transparent;

        font-weight: bold;

}



img {

        border: 0px;

}





.dataTable2 {

        background-color: white;

        border: 1px solid #000066;

        font-size : 9pt;

        margin: 5px;

        width:1000px;

}



.dataTable2 th {

        border-right: 1px solid #c8c8ff;

        padding-left: 2px;

        padding-right:12px;

        font-family: arial, helvetica, sans-serif;

        font-weight: bold;

        color: white;

        background-color: #000066;

        margin-right: 10px;

        white-space: nowrap;

}



.dataTable2  td {

        font-family: verdana, arial, helvetica, sans-serif;

        padding-left: 2px;

}



.dataTable2 tr.total td {

        white-space: nowrap;

        vertical-align: top;

        font-weight: bold;

        border-top: 1px solid black;

        padding-bottom: 10px;

}



.dataTable2 tr.total td.customer {

        visibility: hidden;

}



.dataTable2 td.hidden {

        display: none;

}



.dataTable2 th.hidden {

        display: none;

}



.dataTable2 th.r {

        text-align: right;

        padding-right: 10px;

}



.dataTable2 th.c {

        text-align: center;

}



.dataTable2 td.r {

        text-align: right;

        padding-right: 10px;

}



.dataTable2 td.c {

        text-align: center;

}



.dataTable2  tr.odd {

        background-color: whitesmoke;

}



.dataTable2 tr.even {

        background-color: #d6cfe6;

}



.dataTable2 th a   ,.dataTable2 th a:visited {

        text-align: left;

        color: white;

}



.dataTable2 th a:hover {

        color: #ffcc00;

        background-color: transparent;

}



.dataTable2 .order1 {

        background-position: right;

        background-image: url(../images/arrow_up.gif);

        background-repeat: no-repeat;

}



.dataTable2 .order2 {

        background-position: right;

        background-image: url(../images/arrow_down.gif);

        background-repeat: no-repeat;

}



.dataTable2 tr.rowMouseOver {

        background-image: url(../images/selected.gif);

        background-repeat: repeat-x;

        background-color: #ffff99;

}

thnks