function readOnly(count){ }
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
+ Start a Discussion
Matyas CsabaMatyas Csaba 

Lightning:tab with border

Hello Helper

I  am workig on an lightning component whihc displayes records  from differetn sources  in a tabbed way
I am using a combination  of lightning:tabset  lightning:tab   componets  and aura:iteration
I  would  like to see my  tabs  with soe border

Have a look  at the below  picture
what I  have is  the first  example
what I would  like  to  have  is  something similar you can see in the second example

User-added image

At the end of the day  what I  want to  see is to have my  tabs separated better visualy
thanks in advance  for any suggestion

see the code  I am using. i was playing the  the css classes but obvoiusly  it is not enough


        <lightning:tabset >
         <aura:iteration items="{!v.mySetupdata}" var="obj">
                       <div class=" slds-tabs_scoped">
                       <ul class="slds-tabs_scoped__nav" role="tablist" >
                       <lightning:tab label="{!obj.childObjLabel}"  >
                             <c:LightningDataTable childObjName="{!obj.childObjName}"
                                                   LookupFieldName="{!obj.LookupFieldNameOnSouce}"
                                                   mycolumnNames="{!obj.SourceColumnNames}"
                                                   mycolumnLabels="{!obj.SourceColumnLabels}"
                                                   ParentRecordId="{!obj.ParentRecordID}"/>
                       </lightning:tab>
                       </ul>
                       </div>
         </aura:iteration>
        </lightning:tabset>  

Regards
Csaba
Raj VakatiRaj Vakati
Use variant="scoped" Accepted variants are default, scoped, and vertical.

    <lightning:tabset variant="scoped">