嵌套按钮+在屏幕上的位置

Question

是否有任何不错的干净方式将div的nested按钮元素置于“table”设置的样式中央？

理想情况下，我不想在一个额外的div中包含按钮。

<div class="the-tabs"> 
    <button class="tool-button dark_mini"><img src="Tools-icon.png"></button> 
    <button class="help-button dark_mini"><img src="Info-icon.png"></button> 
    <button class="save-button dark_mini"><img src="Zoom-in-icon.png"></button> 
    <button class="save-button dark_mini"><img src="Save-icon.png"></button> 

       <div id="the_preview" style="width:<?php echo $third_w;?>px;height:<?php echo $third_h;?>px;"> 
        <div id="loading"><img src="images/loading.gif"><br/>Loading .... </div> 

        <img src="<?php echo $the_img;?>" width=" <?php echo $width_new;?>px" height=" <?php echo $height_new;?>px" id="preview" class="preview_color"/> 
       </div> 
</div> 

Answer 1

明白你的意思不是100％，但在这里不用...

.the-tabs { 
    text-align: center; 
} 

这将居中父专区内的按钮。你是这个意思吗？

JSFiddle