How to make two buttons in a row of same size?-CodePudding

I even tried this link

Here is my code

<style>

  .form-style-5{
    max-width: 500px;
    padding: 10px 20px;
    margin-top:2em;
    margin: 10px auto;
    margin-bottom: 1em;
    padding: 30px;
    background-color: #ffffff;
    border-radius: 8px;
    font-family: Georgia, "Times New Roman", Times, serif;
  }

  .container{
    margin-bottom: 2em;
  }

  .col-sm-6{
    width:120px;
    height:50px;
    text-align:center;
    line-height:1.1em;
    font-size:1.1em;
  }
  </style>
<body style="background-color: #040b5a">
    <div  style="padding:50px">
    <form  method="post">
      <h1 style="font-family:verdana">Login</h1>
        {% csrf_token %}
        <table>
        {{form | crispy}}
        <button  type="submit" style="background-color: #040b5a; border: 0px">Login</button>
    </form>
    <hr>
    <div class= "row">
      <div ><a href="/signup"  style="background-color: #040b5a; border: 0px"> Customer Sign-up</a></div>
      <div clas="col-sm-6"><a href="/seller_signup"  style="background-color: #040b5a; border: 0px">Seller Sign-up</a></div>
    </div>
  </table>
</div>
</body>
</html>

CodePudding user response：

Your code were missing "s" for class word on line 40

<div ><a href="/seller_signup"  style="background-color: #040b5a; border: 0px">Seller Sign-up</a></div>

CodePudding user response：

<div class= "row">
  <div ><a > Customer Sign-up</a></div>
<div ><a >Seller Sign-up</a></div>
</div>

 .btn{
width: 100%;
text-align:center;
background: #040b5a;
color:#fff !important;

}