中心和调整大小按钮

Question

#controlpanel .button 
{

    margin: 12px 12px 0px 12px;
     width: 100%;
}

如何让这些按钮填满白框的宽度，但每边都有12px？填充在内部增加空间......并且边距使它们离开白框。

Answer 1

1. 将填充添加到#controlpanel
2. 从按钮
中删除左右边距

3. 将box-sizing：border-box添加到按钮 你应该得到像：

   #controlpanel{     
       padding:0px 12px 12px 12px;
   }
   
   
   #controlpanel .button {
       margin: 12px 0px 0px 0px;
       width: 100%;
       box-sizing:border-box;
       -o-box-sizing:border-box;
       -moz-box-sizing:border-box;
       -ms-box-sizing:border-box;
   }
   

Answer 2

问题是width: 100%;。 尝试注释掉该行并输入：display: block;

Answer 3

有两件事可能会有所帮助：

• 对div#controlpanel
使用填充
• 删除按钮的边距

此外，您还可以尝试删除100％的宽度。