Hi guys I have a little problem with CSS Tabs on my web site.
Tabs are well displayed in all browsers, but the problem occurs when you open a Web site on the iPad. Tabs can not be clicked to show related text in the divs under the tabs.
Any help would be grateful, so i can solve this issue. Tnx
It's probably too late but are you aware of Chris' own Organic Tabs? I think it's a great solution and have used it a couple of times, most recently here.
To make your pure CSS tabs functional on iPad, add onclick="" to each label.
Yes, an empty onclick attribute. See this for reference: http://codepen.io/ryanseddon/pen/AExbc.
It's a commun bug on iOS, but this little trick should fix it.
The other CSS solution to fix it is to put radio inputs on top of labels, with the same size as labels and opacity 0. This way, you don't click on labels, but directly on invisible inputs.
Or you could use a JavaScript solution for an optimal cross-browsering.
Hi guys I have a little problem with CSS Tabs on my web site.
Tabs are well displayed in all browsers, but the problem occurs when you open a Web site on the iPad. Tabs can not be clicked to show related text in the divs under the tabs.
Any help would be grateful, so i can solve this issue. Tnx
I suggest using javascript for tabbed functionality: http://jqueryui.com/demos/tabs/
Thank you Jamy for your reply. I found solution here.
Site
tnx
It's probably too late but are you aware of Chris' own Organic Tabs? I think it's a great solution and have used it a couple of times, most recently here.
To make your pure CSS tabs functional on iPad, add
onclick=""to each label. Yes, an empty onclick attribute. See this for reference: http://codepen.io/ryanseddon/pen/AExbc.It's a commun bug on iOS, but this little trick should fix it.
The other CSS solution to fix it is to put radio inputs on top of labels, with the same size as labels and opacity 0. This way, you don't click on labels, but directly on invisible inputs.
Or you could use a JavaScript solution for an optimal cross-browsering.
Thank you guys, I was in a hurry to finish this menu. But next time for my new project i will use this great examples.