Create a CSS-only tab navigation system.
HardProblem Statement
Create a CSS-only tab navigation system.
Sample Output
Clicking on each tab displays its corresponding content while hiding the others.
Limits
Time: 2s · Memory: 256 MB
Code Editor
Log in to submit00:00
Try your code in this preview. Submit marks it done.
<!DOCTYPE html>
<html>
<head>
<style>
/* Add CSS here to create the tab navigation system */
</style>
</head>
<body>
<div class="tabs">
<input type="radio" id="tab1" name="tab" checked />
<label for="tab1">Tab 1</label>
<div class="content">Content for Tab 1</div>
<input type="radio" id="tab2" name="tab" />
<label for="tab2">Tab 2</label>
<div class="content">Content for Tab 2</div>
<input type="radio" id="tab3" name="tab" />
<label for="tab3">Tab 3</label>
<div class="content">Content for Tab 3</div>
</div>
</body>
</html>
Document
To view the HTML changes, please type the code within the editor