Display issue
Display issue
CasperTDk
Posts: 5Questions: 0Answers: 0
Here is a screenshot: http://imgur.com/Ah326
As you can see, the table is displayed on top of the search box.
This is my applied style:
[code]
.currRow
{
background-color: Gray;
cursor: pointer;
}
.dataTables_length
{
width: 40%;
float: left;
}
/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
* DataTables sorting
*/
.dataTables_wrapper {
position: relative;
width="600px";
min-height: 302px;
clear: both;
_height: 302px;
zoom: 1; /* Feeling sorry for IE */
}
.dataTables_processing {
position: absolute;
top: 50%;
left: 50%;
width: 250px;
height: 30px;
margin-left: -125px;
margin-top: -15px;
padding: 14px 0 2px 0;
border: 1px solid #ddd;
text-align: center;
color: #999;
font-size: 14px;
background-color: white;
}
.sorting_asc
{
background-image: url('../images/sort_asc.png');
background-repeat: no-repeat;
background-position: right top;
margin-right: 30px;
}
.sorting_desc
{
background-image: url('../images/sort_desc.png');
background-repeat: no-repeat;
background-position: right top;
margin-right: 20px;
}
.sorting
{
background-image: url('../images/sort_both.png');
background-repeat: no-repeat;
background-position: right top;
margin-right: 20px;
}
.sorting_asc_disabled
{
background-image: url('../images/sort_asc_disabled.png');
background-repeat: no-repeat;
background-position: right top;
margin-right: 20px;
}
.sorting_desc_disabled
{
background-image: url('../images/sort_desc_disabled.png');
background-repeat: no-repeat;
background-position: right top;
margin-right: 20px;
}
.dataTables_filter
{
width: 50%;
float: right;
text-align: right;
}
[/code]
Here is the JS:
[code]
$('#Sagsoversigt_GridViewSagsoversigt').dataTable({
"bPaginate": true,
"bLengthChange": true,
"bFilter": true,
"bSort": true,
//"bInfo": false,
"bAutoWidth": true,
"aaSorting": [[1, "desc"]],
"bStateSave": true,
"aoColumns": [
{ "bSortable": false },
null,
null,
null,
null,
null,
null,
null
],
"oLanguage": {
"sLengthMenu": "Vis _MENU_ records per side",
"sZeroRecords": "Intet fundet",
"sInfo": "Viser _START_ til _END_ ud af _TOTAL_ records",
"sInfoEmpty": "Viser 0 til 0 ud af 0 ",
"sInfoFiltered": "(filtreret ud af _MAX_ total records)"
}
});[/code]
As you can see, the table is displayed on top of the search box.
This is my applied style:
[code]
.currRow
{
background-color: Gray;
cursor: pointer;
}
.dataTables_length
{
width: 40%;
float: left;
}
/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
* DataTables sorting
*/
.dataTables_wrapper {
position: relative;
width="600px";
min-height: 302px;
clear: both;
_height: 302px;
zoom: 1; /* Feeling sorry for IE */
}
.dataTables_processing {
position: absolute;
top: 50%;
left: 50%;
width: 250px;
height: 30px;
margin-left: -125px;
margin-top: -15px;
padding: 14px 0 2px 0;
border: 1px solid #ddd;
text-align: center;
color: #999;
font-size: 14px;
background-color: white;
}
.sorting_asc
{
background-image: url('../images/sort_asc.png');
background-repeat: no-repeat;
background-position: right top;
margin-right: 30px;
}
.sorting_desc
{
background-image: url('../images/sort_desc.png');
background-repeat: no-repeat;
background-position: right top;
margin-right: 20px;
}
.sorting
{
background-image: url('../images/sort_both.png');
background-repeat: no-repeat;
background-position: right top;
margin-right: 20px;
}
.sorting_asc_disabled
{
background-image: url('../images/sort_asc_disabled.png');
background-repeat: no-repeat;
background-position: right top;
margin-right: 20px;
}
.sorting_desc_disabled
{
background-image: url('../images/sort_desc_disabled.png');
background-repeat: no-repeat;
background-position: right top;
margin-right: 20px;
}
.dataTables_filter
{
width: 50%;
float: right;
text-align: right;
}
[/code]
Here is the JS:
[code]
$('#Sagsoversigt_GridViewSagsoversigt').dataTable({
"bPaginate": true,
"bLengthChange": true,
"bFilter": true,
"bSort": true,
//"bInfo": false,
"bAutoWidth": true,
"aaSorting": [[1, "desc"]],
"bStateSave": true,
"aoColumns": [
{ "bSortable": false },
null,
null,
null,
null,
null,
null,
null
],
"oLanguage": {
"sLengthMenu": "Vis _MENU_ records per side",
"sZeroRecords": "Intet fundet",
"sInfo": "Viser _START_ til _END_ ud af _TOTAL_ records",
"sInfoEmpty": "Viser 0 til 0 ud af 0 ",
"sInfoFiltered": "(filtreret ud af _MAX_ total records)"
}
});[/code]
This discussion has been closed.