-3

I am new to css and html5 and trying to get top buttons to work properly. The buttons are horizontal align left. I can seem to be adding the proper space between them. How can fix my code without messing my page lay out? Thank you very much for your help here is the code:

    .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>
isherwood
  • 46,000
  • 15
  • 100
  • 132
user2836884
  • 1
  • 1
    The buttons currently have 2-3 px between them. You haven't told us what "the proper space" is, nor have you explained how reducing the space will affect your page layout. – isherwood Dec 06 '14 at 16:48
  • possible duplicate of [How to remove the space between inline-block elements?](http://stackoverflow.com/questions/5078239/how-to-remove-the-space-between-inline-block-elements) – Salman A Dec 06 '14 at 18:36

1 Answers1

0
 button {
   margin-right: 50px; /* whaever spacing you want */
 }
Armand Karambasis
  • 134
  • 7