A simple solution for having tabbed content on a large screen but turn it into accordion on a smaller one. Just resize your screen below 800 pixels to see the tabbed interface transforming into an accordion.

In order to keep the HTML as clean as possible, without duplicating elements, we use element attributes as CSS content to display the accordion tabs.

Tab 2 content. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Donec odio. Quisque volutpat mattis eros. Nullam malesuada erat ut turpis. Suspendisse urna nibh, viverra non, semper suscipit, posuere a, pede. Nullam malesuada erat ut turpis. Suspendisse urna nibh, viverra non, semper suscipit, posuere a, pede.
Tab 3 content. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Donec odio. Quisque volutpat mattis eros. Nullam malesuada erat ut turpis. Suspendisse urna nibh, viverra non, semper suscipit, posuere a, pede. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Donec odio. Quisque volutpat mattis eros. Nullam malesuada erat ut turpis. Suspendisse urna nibh, viverra non, semper suscipit, posuere a, pede. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Donec odio. Quisque volutpat mattis eros. Nullam malesuada erat ut turpis. Suspendisse urna nibh, viverra non, semper suscipit, posuere a, pede.

Tabs on the side

10 Days Cultural Sightseeing Tour

Duration

10 Days 09 Nights

Location

Sigiriya - Polonnaruwa - Minneriya - Anuradhapura - Mihintale - Hiruwaduna Village - Matale - Kandy - Nuwara Eliya - Ella - Tissamaharama - Yala - Mirissa -Galle - Airport

Lanka Budget Tours
Typically replies within an hour

Lanka Budget Tours
Hi there 👋
How can I help you?
08.55
×
Chat with Me