Edit: Downside is there doesn't seem to be a way to apply an active state to the tab. So with either approach we can only meet 2/3 of the requirements to make usable tabs. So, once again, this is why we end up turning to JS.
I like using :target for routing (spoilers for the next article! 🤫) but I also don't have a good way of doing active states nicely.
I was thinking of showing it being done with a bunch of copies of tabs where 1 is manually marked as active with a class so the Tab and Tab Content is swapped based on active state. I decided not to because it's a lot of repetition.
For further actions, you may consider blocking this person and/or reporting abuse
We're a place where coders share, stay up-to-date and grow their careers.
Or you could just use CSS's
:targetselector. Not only is this a simpler implementation, but it also supports "deep linking" via the hashed url value.Example: stackblitz.com/edit/web-platform-2...
Edit: Downside is there doesn't seem to be a way to apply an active state to the tab. So with either approach we can only meet 2/3 of the requirements to make usable tabs. So, once again, this is why we end up turning to JS.
I like using :target for routing (spoilers for the next article! 🤫) but I also don't have a good way of doing active states nicely.
I was thinking of showing it being done with a bunch of copies of tabs where 1 is manually marked as active with a class so the Tab and Tab Content is swapped based on active state. I decided not to because it's a lot of repetition.