'Putting space between 2 buttons in a td

i have a td

<td align="left">              
    <button class="button_tabel"><div class="button_tabel_text_hero"> hero</div>   </button>  
    
    
                       <!-- todo Put a gap   here 48 px  -->           
    
    
    <button class="button_tabel"><div class="button_tabel_text_zero"> zero </div>   </button>          
    
</td>

How can i put a gap of around 48 px in between these two buttons which lie in this td

i wish to put space separately out of buttons so that this can be changed from backbone easily without impacting other components



Solution 1:[1]

Add margin-left:48px on .button_tabel

.button_tabel + .button_tabel{
   margin-left:48px;
}

Solution 2:[2]

Just select the first class and add a margin:

.button_tabel:first-child{
  margin-right:48px;
}
<td align="left">              
    <button class="button_tabel"><div class="button_tabel_text_hero"> hero</div>   </button>  
    
    
                       <!-- todo Put a gap   here 48 px  -->           
    
    
    <button class="button_tabel"><div class="button_tabel_text_zero"> zero </div>   </button>          
    
</td>

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1
Solution 2 MaxiGui