ThemeRoller + DataTable Header

ThemeRoller + DataTable Header

powderpowder Posts: 2Questions: 0Answers: 0
edited April 2010 in General
Hi Guys

First off just like to say thanks for building a great qjuery plugin.

I am having a small problem applying a ThemeRoller theme to my dataTable.

This is what my table looks like: http://screencast.com/t/NjI2MjMwZjgt as you can see the table header's height is to large.

I have done this:
[code]

$(document).ready(function() {
$('#example').dataTable({
"bJQueryUI": true

});
} );

[/code]

Also in my header I have this:

[code]






[/code]

All CSS files have been left as default.

But this is what my table looks like: http://screencast.com/t/NjI2MjMwZjgt as you can see the table header's height is to large. Using FireBug the element THEAD has an offsetheight of 43

The example on your site looks like this http://screencast.com/t/Nzk5ZDkxMj Using FireBug the element THEAD has an offsetheight of 30

I come from a php developer background and not great with CSS but I can see it is something to do with the THEAD offsetheight value.

What am I doing wrong ???

Here is my HTML code for the table

[code]



Domain
Today
Last 7 Days
Last 30 Days




<?php foreach($this->websites as $website) :?>

<?php echo $website['domain']; ?>
<?php echo $website['today'] ;?>
<?php echo $website['last7Days'] ;?>
<?php echo $website['last30Days'] ;?>

<?php endforeach;?>



Any help would be greatfull recieived.

Regards
Chris
[/code]

Replies

  • CassiannoCassianno Posts: 19Questions: 0Answers: 0
    You're probably missing css_right class declaration somewhere.

    It's applied to the order icons and its basically:
    [code].css_right {
    float: right;
    }[/code]
    Check with firebug styles for your elements ;D
  • powderpowder Posts: 2Questions: 0Answers: 0
    Thanks Cassianno

    Your were right there was no declaration for .css_right

    I have defined it in demo_table_jui.css and it fixed the problem.

    Is this the right place to declare it ?? Or should I put it in jquery-ui-1.8.custom. I think it needs to go in demo_table_jui.css as what ever Themeroller I used I had the same problem with the header.

    Thanks

    Chris
  • CassiannoCassianno Posts: 19Questions: 0Answers: 0
    edited April 2010
    You can declare it whenever you want.

    As for me, i've declared at my main stylesheet, so i can override previous "right" and "left" classes i had to do the same job on elements.

    I suggest putting it on demo_table_jui.css, so whenever you want to change your themeroller theme, you'll be able to do this without changing jquery-ui theme's css, as you already mentioned. Also, remember that if you upgrade or replace the demo_table_jui.css for another file, u'll lose it too. So, basically, i suggest putting it on your custom css file or inline at DT page :)

    BB
This discussion has been closed.