ok - now I understand. In the inline <style> you are using class name 'subHhead' where in the included css file your rules #Gadget subHhead
Which means that this class applies to element with class=subHhead that are decedents of a dom element with id=Gadget. There is no such dom element in the gadgets DOM tree. Furthermore you are mixing node types and classNames, e.g. td is a node name and not a class name (hover is also reserved). Let me know if this makes sense, ChartMan On Tue, Jun 30, 2009 at 2:30 PM, Ashish Agarwal <[email protected]>wrote: > yeah, styles are not working, That's why I have to give the styles in the > gadget xml. If I removes the style classes from gadget xml , I am not able > to access them from external css file. > > > On Tue, Jun 30, 2009 at 4:36 PM, ChartMan <[email protected]> wrote: > >> I just loaded your gadget to my iGoogle page and inserted a data source >> url (a trix sheet) and go a table with the styles defined in your css file. >> Are you sure the styles are not working for you. >> >> ChartMan >> >> >> On Tue, Jun 30, 2009 at 12:21 PM, Ashish Agarwal < >> [email protected]> wrote: >> >>> Earlier in the code it was fake url. Please find the following links: >>> >>> My gadget URL >>> http://ashish-dev.googlecode.com/svn/trunk/list_table_gadget.xml >>> >>> CSS url >>> http://ashish-dev.googlecode.com/svn/trunk/ipathshala.css >>> >>> Thanks >>> Ashish Agarwal >>> >>> On Tue, Jun 30, 2009 at 12:44 PM, ChartMan <[email protected]>wrote: >>> >>>> Hi >>>> >>>> I am not able to access the stylesheet myself, it might be the case that >>>> the gadget is also not able to access the sheet. >>>> So either send me a link to your gadget that I can load and see why it >>>> fails; or >>>> 1) verify that the file is loaded to the page (you can use FireBug in >>>> Firefox or 'inspect element' in Chrome). >>>> 2) verify that your class name is applied to the table dom tree. >>>> >>>> >>>> Let me know how it goes, >>>> >>>> ChartMan >>>> >>>> >>>> On Tue, Jun 30, 2009 at 9:01 AM, Ashish Agarwal < >>>> [email protected]> wrote: >>>> >>>>> Hi, >>>>> >>>>> I tried the following code to get the CSS in my gadget >>>>> >>>>> <Content type="html"><![CDATA[ >>>>> <head> >>>>> <meta http-equiv="Content-Type" >>>>> content="text/html; charset=utf-8" /> >>>>> <title>Time Table</title> >>>>> <script src="http://www.google.com/jsapi"; >>>>> type="text/javascript"></script> >>>>> <div id="tablediv" style="overflow: auto;"> >>>>> <img src="http://www.google.com/ig/images/spinner.gif"; /></div> >>>>> *<link >>>>> href="**http://xyz.com/svn/trunk/designs/css/abc.css*<http://xyz.com/svn/trunk/designs/css/abc.css> >>>>> *" rel="stylesheet" type="text/css" />* >>>>> </head> >>>>> <body> >>>>> >>>>> The external css is having following styles: >>>>> #Gadget .subHhead { >>>>> background-color:#98BCCC; >>>>> color:#000000; >>>>> height:20px; >>>>> font-size:11px; >>>>> } >>>>> And I am assigning subHhead to headerRow . >>>>> var cssClassNames = { >>>>> 'headerRow': 'subHhead', >>>>> 'tableRow': 'td'}; >>>>> >>>>> Added cssClassNames to options >>>>> >>>>> var options = {'showRowNumber': false, 'allowHtml': true, >>>>> 'cssClassNames': cssClassNames, 'alternatingRowStyle': true}; >>>>> >>>>> Draw the table with the options >>>>> table.draw(data, options); >>>>> >>>>> >>>>> I used the above code in the xml given by >>>>> http://www.google.com/ig/modules/simple-table.xml. But, my external >>>>> CSS is not getting applied. >>>>> >>>>> Am I doing anything wrong? When I used the same styles in my xml, I am >>>>> able to see the changes. >>>>> >>>>> Another query is what all styles are available with google >>>>> visualization Table. From where can i get this information. From the >>>>> following link I see following styles >>>>> http://code.google.com/apis/visualization/documentation/examples.html >>>>> >>>>> var cssClassNames = { >>>>> 'headerRow': 'italic-darkblue-font large-font bold-font', >>>>> 'tableRow': '', >>>>> 'oddTableRow': 'beige-background', >>>>> 'selectedTableRow': 'orange-background large-font', >>>>> 'hoverTableRow': '', >>>>> 'headerCell': 'gold-border', >>>>> 'tableCell': '', >>>>> 'rowNumberCell': 'underline-blue-font'}; >>>>> >>>>> >>>>> Thanks >>>>> Ashish Agarwal >>>>> >>>>> >>>>> On Mon, Jun 29, 2009 at 5:34 PM, ChartMan <[email protected]> wrote: >>>>> >>>>>> 1. Here is a good example on how to use css classes to configure the >>>>>> table. The class definitions can come from an external css file. >>>>>> >>>>>> http://code.google.com/apis/visualization/documentation/examples.html#custom_table_example >>>>>> >>>>>> 2. What is the html view of the table? >>>>>> >>>>>> ChartMan >>>>>> >>>>>> >>>>>> On Mon, Jun 29, 2009 at 1:11 PM, Ashish Agarwal < >>>>>> [email protected]> wrote: >>>>>> >>>>>>> >>>>>>> Hello friends, >>>>>>> >>>>>>> I am using visualization API for creating a gadget which will show >>>>>>> simple data table. I want to modify the structure of table using >>>>>>> external CSS file. How can I do that? >>>>>>> >>>>>>> I used the following link to modify the table configuration >>>>>>> >>>>>>> http://code.google.com/apis/visualization/documentation/gallery/table.html#Configuration_Options >>>>>>> but I have to give the stylesheet code in the same file. I want to >>>>>>> use >>>>>>> external CSS file. Please help me. >>>>>>> >>>>>>> Second, is there any way to see the html view of table which is >>>>>>> generated by google.visualization.Table. >>>>>>> >>>>>>> >>>>>>> Thanks >>>>>>> Ashish agarwal >>>>>>> >>>>>>> >>>>>>> >>>>>> >>>>>> >>>>>> >>>>> >>>>> >>>>> -- >>>>> Regards, >>>>> Ashish Agarwal >>>>> Ph. 9250092550 >>>>> >>>>> >>>>> >>>>> >>>> >>>> >>>> -- >>>> Regards, >>>> Ashish Agarwal >>>> Ph. 9250092550 >>>> >>>> >>>> >> >> >> -- >> Regards, >> Ashish Agarwal >> Ph. 9250092550 >> >> >> >> --~--~---------~--~----~------------~-------~--~----~ You received this message because you are subscribed to the Google Groups "Google Visualization API" group. To post to this group, send email to [email protected] To unsubscribe from this group, send email to [email protected] For more options, visit this group at http://groups.google.com/group/google-visualization-api?hl=en -~----------~----~----~----~------~----~------~--~---
![http://www.google.com/ig/images/spinner.gif"](https://www.google.com/ig/images/spinner.gif"){kind=link}