"v4 - Vertical Tab (1)"
Bootstrap 3.3.0 Snippet by RajeshPatadiya

<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/js/bootstrap.min.js"></script> <script src="//code.jquery.com/jquery-1.11.1.min.js"></script> <!------ Include the above in your HEAD tag ----------> <div class="tabordion"> <section id="section1"> <input type="radio" name="sections" id="option1" checked> <label for="option1">John Lennon</label> <article> <h2>John Lennon</h2> <p>John Ono Lennon, (born John Winston Lennon; 9 October 1940 – 8 December 1980), was an English musician, singer and songwriter who rose to worldwide fame as a founder member of the rock band the Beatles, the most commercially successful band in the history of popular music. With Paul McCartney, he formed a songwriting partnership that is one of the most celebrated of the 20th century.</p> <p>Born and raised in Liverpool, as a teenager Lennon became involved in the skiffle craze; his first band, the Quarrymen, evolved into the Beatles in 1960. When the group disbanded in 1970, Lennon embarked on a solo career that produced the critically acclaimed albums John Lennon/Plastic Ono Band and Imagine, and iconic songs such as "Give Peace a Chance" and "Working Class Hero". After his marriage to Yoko Ono in 1969, he changed his name to John Ono Lennon. Lennon disengaged himself from the music business in 1975 to raise his infant son Sean, but re-emerged with Ono in 1980 with the new album Double Fantasy. He was murdered three weeks after its release.</p> </article> </section> <section id="section2"> <input type="radio" name="sections" id="option2"> <label for="option2">Paul McCartney</label> <article> <h2>Paul McCartney</h2> <p>Sir James Paul McCartney, (born 18 June 1942), is an English musician, singer, songwriter, multi-instrumentalist, and composer. With John Lennon, George Harrison and Ringo Starr, he gained worldwide fame as a member of the Beatles, widely regarded as one of the most popular and influential acts in the history of rock music; his songwriting partnership with Lennon is one of the most celebrated of the 20th century. After the band's break-up, he pursued a solo career and later formed Wings with his first wife, Linda, and Denny Laine.</p> <p>McCartney has been recognised as one of the most successful composers and performers of all time, with 60 gold discs and sales of over 100 million albums and 100 million singles of his work with the Beatles and as a solo artist.[2] More than 2,200 artists have covered his Beatles song "Yesterday", more than any other copyrighted song in history. Wings' 1977 release "Mull of Kintyre" is one of the all-time best-selling singles in the UK. Inducted into the Rock and Roll Hall of Fame as a solo artist in March 1999, McCartney has written, or co-written 32 songs that have reached number one on the Billboard Hot 100, and as of 2014 he has sold more than 15.5 million RIAA-certified units in the United States. McCartney, Lennon, Harrison and Starr received MBEs in 1965, and in 1997, McCartney was knighted for his services to music.</p> <p>McCartney has released an extensive catalogue of songs as a solo artist and has composed classical and electronic music. He has taken part in projects to promote international charities related to such subjects as animal rights, seal hunting, land mines, vegetarianism, poverty, and music education. He has married three times and is the father of five children.</p> </article> </section> <section id="section3"> <input type="radio" name="sections" id="option3"> <label for="option3">George Harrison</label> <article> <h2>George Harrison</h2> <p>George Harrison, (25 February 1943 – 29 November 2001), was an English musician, multi-instrumentalist, singer and songwriter who achieved international fame as the lead guitarist of the Beatles. Although John Lennon and Paul McCartney were the band's primary songwriters, most of their albums included at least one Harrison composition, including "While My Guitar Gently Weeps", "Here Comes the Sun" and "Something", which became the Beatles' second-most-covered song.</p> </article> </section> </div>
.tabordion { color: #333; display: block; font-family: arial, sans-serif; margin: auto; position: relative; width: 350px; } .tabordion input[name="sections"] { left: -9999px; position: absolute; top: -9999px; } .tabordion section { display: block; } .tabordion section label { background: #ccc; border: 1px solid #fff; cursor: pointer; display: block; font-size: 1.2em; font-weight: bold; padding: 15px 20px; box-sizing: border-box; position: relative; width: 100%; z-index: 100; } .tabordion section article { display: none; width: 100%; position: absolute; top: 166px; } .tabordion input[name="sections"]:checked+label { background: #eee; color: #bbb; } .tabordion input[name="sections"]:checked~article { display: block; } @media (max-width: 533px) { h1 { width: 100%; } .tabordion { width: 100%; } .tabordion section label { font-size: 1em; width: 160px; } .tabordion section article { left: 200px; min-width: 270px; } .tabordion section article:after { background-color: #ccc; bottom: 0; content: ""; display: block; left: -199px; position: absolute; top: 0; width: 200px; } }

Related: See More


Questions / Comments: