How to centre side by side radio buttons on page

  css, html, php

I’ve created side-by-side radio buttons and have tried to center them on my web page but one of the buttons doesn’t move when I’m editing the margin sizes. I would like to move the left button more to the left.

My HTML code:

<div class="choice"
      <tr>
          <td><input type="radio" name = "dreg">I want to post my event</td>

          <td><input type="radio" name = "dreg">I want to attend an event</td>

      </tr>
</div>

CSS code:

.choice {
  text-align: center;
  padding: 16px 100px;
  font-size: 150%
}

input[type="radio"]{
  margin: 40px 10px 100px 100px;
  cursor: pointer;

}

Source: Ask PHP

LEAVE A COMMENT