Announcement

Collapse
No announcement yet.
X
  • Filter
  • Time
Clear All
new posts

    tab widths differ between browsers

    Hi there,

    i am surprised to see that the tab widths can differ so much between browsers.

    See attached screenshots! Especially notice how much further to the right the tabs end in firefox. In IE its also ok, while in Safari it's as bad as in Chrome.

    Code:
    Tab tab = new Tab();
    tab.setWidth(60);
    ...
    TabSet.addTab(tab);
    Am i doing something wrong here... ? Advice would be appreciated.

    Would love to know that if the text fits in one browser, it will fit in others.
    Attached Files

    #2
    hay,

    No need to use setWidth()

    It automatically loads with actual width,try doing that..

    Then,i donot know the reason why its displaying different.may be due to browser width

    Comment


      #3
      I did that initially. They are too short if i don't set the width, the text is hidden.

      But thanks anyway!

      Comment


        #4
        but i have no such issues...even i have much more length for the text in the tab..
        How u set the image and the text ?

        Comment


          #5
          I just noticed in another thread where some people had the same issue that someone said that you have to explicitly call "seticonwidth" and height.

          I tried that, and the text isn't hidden anymore, at least not in ff.

          do you know how to set margin around icon/text in the tab?

          Thanks again.

          Comment


            #6
            hi,

            you can override the default style.

            ie,the style of tabtitle is "tabtitle" ,which is return in skin_style.css,
            that style s loading on runtime..
            so browser looks for the style name ,so u can write externally in ur style sheet or in html page

            <style>
            .tabTitle,
            .tabTitleDown,
            .tabTitleOver,
            .tabTitleDisabled,
            .tabTitleSelected,
            .tabTitleSelectedDown,
            .tabTitleSelectedOver,
            .tabTitleSelectedDisabled,
            .vtabTitle,
            .vtabTitleSelected,
            .vtabTitleOver,
            .vtabTitleDown,
            .vtabTitleSelectedOver,
            .vtabTitleSelectedDown,
            .vtabTitleDisabled,
            .vtabTitleSelectedDisabled {
            // default style
            color: black;
            font-family:Arial,Verdana,sans-serif; font-size:11px;
            padding-bottom:1px;
            // custom style
            // here u can put the margin/padding

            }

            </style>

            Comment


              #7
              Yeah, thanks, thats what i did yesterday after spending an hour searching the interwebz ;)

              setting up a new style with another name and then calling
              Code:
              tab.setAttribute("titleStyle", "dashTitle");
              did the trick!

              Again, thanks for your time!

              Comment


                #8
                Added Tab.setTitleStyle(..) to SVN.

                Comment

                Working...
                X