【问题标题】:How to reduce space between buttons?如何减少按钮之间的空间?
【发布时间】:2014-12-06 15:26:39
【问题描述】:

我是 css 和 html5 的新手,并试图让顶部按钮正常工作。按钮水平左对齐。我似乎在它们之间添加了适当的空间。如何在不弄乱我的页面布局的情况下修复我的代码?非常感谢您的帮助,代码如下:

    .dashboard, #logOuta {
        width:160px;
        padding:10px 25px 12px 26px;
        font-size:18px;
        text-decoration:none;
        font-family:Arial;
        color:#fff;
        text-align:center;
        box-shadow:1px 1px 1px #666;
        background:#23A3DA;
        background-image:-webkit-linear-gradient(top,#23A3DA,#03171F);
        background-image:-moz-linear-gradient(top,#23A3DA,#03171F);
        background-image:-ms-linear-gradient(top,#23A3DA,#03171F);
        background-image:-o-linear-gradient(top,#23A3DA,#03171F);
        background-image:linear-gradient(to bottom,#23A3DA,#03171F);
        border-bottom:2px solid #ffd175;
        -webkit-border-radius:5;
        -moz-border-radius:5;
        border-radius:5px;
        -webkit-box-shadow:1px 1px 1px #666;
        -moz-box-shadow:1px 1px 1px #666;
        cursor:pointer
    }
    
    .dashboard:hover {
        background:#E3A019;
        background-image:-webkit-linear-gradient(top,#E3A019,#E3A019);
        background-image:-moz-linear-gradient(top,#E3A019,#E3A019);
        background-image:-ms-linear-gradient(top,#E3A019,#E3A019);
        background-image:-o-linear-gradient(top,#E3A019,#E3A019);
        background-image:linear-gradient(to bottom,#E3A019,#E3A019);
        text-decoration:none
    }
     <div class="logoutbox">
              <button class="dashboard">Dashboard</button>
              <input name="logOuta" type="button" id="logOuta" value="Sign Out"/>
      </div>

【问题讨论】:

标签: css html button


【解决方案1】:
 button {
   margin-right: 50px; /* whaever spacing you want */
 }

【讨论】: