So I have this Tabs element with 4 tabs. Sometimes I need to render all tabs but most of the times I’m just rendering 2 out of the 4 tabs. But this somehow leaves me in my app with a huge gap between the 1st and the 4th tab, for instance when I dont render the 2nd and 3rd tab. Why is this not aligning up nicely?
Hi @alexanderl
Can you share a video or screenshots of how things are setup on your side? It’ll help us reproduce your use case. For example, from your description, I don’t know how you setup the conditional rendering of the tabs.
What I want to achieve is that the tabs shift 1 spot to the left if there’s an empty spot. That would be much neater.
@Joyce sorry forgot to tag you
Hi @Joyce , was wondering if you had a moment to look at the screenshots Thanks!
Reported the same issue a while ago. Need to wait for an update on this element or build tabs yourself. Reordering tabs would also be a nice feature to have. Now I have to completely rebuild the tabs when I need to reorder.
Yeah exactly, reordering would be nice, this is kinda painful at the moment.
Ah, sorry for the late reply, I missed the notification!
I think @FHEXL is correct and it’s a limitation of our current tabs element. You’ll get more flexibility if you build your own tabs component.
Improving these ready-made elements is on our roadmap but we’re waiting for two things first:
- the marketplace, which will be released in a couple of weeks. We think / hope community members will share some of their components on there so other, less design-savvy users can save a bit of time.
- the cleaning of the DOM (we’ll be removing loads of wrappers that can make it trickier to play with elements). Dev work has started on this but it’s quite a big project so hard to give an ETA for this right now.