TabSheet in WebKit for iOS

Hello Vaadiners !

This is my first post here at the forum, so first of all I want to send a BIG THANK YOU to the Vaadin team for an absolute fantastic framework … I Love it !!

I am also very grateful for this forum and all the participants coming with good solutions, I have solved all of my problems so far, by reading these pages.

Now I have a small problem that I cant solve:

We have a vaadin application running on our server. Its tested and works perfect in any browser we have tested.
We have also made a very thin iPad client with a WebView pointing to our server.
This solution works very well except for one thing, the Caption in the Tabs in the TabSheet are truncated and shows only one character.
(attached a image of the truncated TabSheet)
The strange thing is that it works perfect in Safari on the iPad. ( I was thinking they both used the same WebKit engine)

This very small issue is stopping us from putting the (Easy access) application on the appStore.

Is there any solution to this corner case ?

Best Regards

I have a strong feeling this can be solved by modifying the css theme in some way.

Any suggestions are appreciated!


Seems very strange, haven’t seen anything similar before. It would help if you could reproduce the same error in a desktop browser, so we could inspect it more easily. Trying to solve a CSS issue on a touch device is rather hard without proper tools.

Do you have any custom theme/CSS in use? The first thing I would guess is that the padding of one of the tab elements is off.

Thanks for pointnig me in a good direction.

Yes I have some custom css (very litle) based on the reindeer theme.
What I found out now is that the problem disaper if i base my custom theme on the runo theme.

stripping of my own custom themeing have no impact.

iam detecting if the request comes from the iPad client, so I guess I can fallback to runo if iPad is detetcted.