Having problem with adding Zenddesk support tab to vaadin application


See Zenddesk support tab https://support.zendesk.com/home ( black on left side something similar to Vaadin “Pro Support” tab.

I want to add Zenddesk support tab to my vaadin application for that I’m adding Zenddesk related script using

writeAjaxPageHtmlVaadinScripts(…) in my MyApplicationServlet(extends AbstractApplicationServlet)

But the positioning of and sizing of support tab is not as expected, very unexpected.
[ Details:-

  1. Location of support tab and sizing is different.
  2. After Click on support tab complete there should be a for in the middle of the page, but when click a form covering all area but not align and sizing correctly
  3. Width of internal iFrame is not set why?

Please suggest me How can I solve these problem

More :-
(How to addd Zendesk, https://support.zendesk.com/entries/20990726-Setting-up-your-Feedback-Tab-channel#topic_sly_egf_ff)

Thanks in Advance

Hi Guys,

I have solved this problem. :slight_smile:

When I removed my css code from Servlet and include it from my custom theme css file then everything start working as Expected.

MyApplicationServlet :
protected void writeAjaxPageHtmlVaadinScripts(Window window,
String themeName, Application application,
final BufferedWriter page, String appUrl, String themeUri,
String appId, HttpServletRequest request) throws ServletException,
… include java script file

         //Moved this code to my styles.css file and everything is working fine now
         ---page.write("<script type='text/css' src='" + themeUrl + "/mycustomcssfile.css'></script>");-----

         .. java script code inside java script tag


@import url(mycustomcssfile.css);

#support_tab {
left: -50px !important;

Anybody have any idea why it was not working from previous location (Code was included in generated html but not working as expected, checked with the help of Firebug)