0

I currently have 2 submit buttons that cannot be place side by side.

enter image description here

    .submit-button {
         color: #fff;
         background: #55a1ff;
         border: 0;
         outline: 0;
         width: calc(15%);
         height: 50px;
         font-size: 16px;
         text-align: center;
         cursor: pointer;
         margin-top: 70px;
         margin-left:100px;
         border-radius: 30px;
    }

    .cancel-button {
         color: #fff;
         background: #55a1ff;
         border: 0;
         outline: 0;
         width: calc(15%);
         height: 50px;
         font-size: 16px;
         text-align: center;
         cursor: pointer;
     
         margin-left:450px;
         border-radius: 30px;

    }

 

<div class="arrange3">
    <button type="submit" class="submit-button" name="save", value="save">Submit</button>
</div>


<div class="arrange3">
    <button type="cancel" class="cancel-button" name="cancel", value="save">Cancel Claim</button>
</div>

How am i suppose to place the buttons side by side. It would be great if u can provide the code to me. Thanks

pjcunningham
  • 7,676
  • 1
  • 36
  • 49
Elton Tan
  • 49
  • 1
  • 13

1 Answers1

0

Make arrange3 class display inline.

.arrange3{
    display: inline;
}
Thibaut
  • 170
  • 2
  • 14
  • I cant.. both are using different form action methods – Elton Tan May 14 '21 at 02:52
  • I'm not sure why it shouldn't be possible. But anyway.. on the first div u can put an inline style with float: left; – Thibaut May 14 '21 at 03:04
  • Well, that's weird, I used your code exactly and it does work for me. I also noticed with the margin lefts on the buttons, if the page is too small that the buttons will wrap. Try removing the margin lefts and see if it works. – Thibaut May 14 '21 at 03:21
  • Nope it doesnt work..thanks for your help anyways – Elton Tan May 14 '21 at 03:28