开发者

How do I center this form-button block?

开发者 https://www.devze.com 2023-02-20 10:42 出处:网络
I want this f开发者_Go百科orm band button to line up horizontally and to sit as a whole in the horizontal center of the page.

I want this f开发者_Go百科orm band button to line up horizontally and to sit as a whole in the horizontal center of the page.

How do I set my css?

<form action="signup.php" method="post">
         <fieldset>
          <label>Email: <label>
          <input type="text" name="email" id="email" placeholder='email address' />
          <input type="submit" value="Sign Up" class= "button" />
          </fieldset>
          </form>


Plenty of ways to tackle this. Here is one solution. Though, I do recommend not using inline styles, but here is your form with the CSS.

<form action="signup.php" method="post" style="margin: 0 auto; width: 350px;">
  <fieldset>
    <label>Email: <label>
    <input type="text" name="email" id="email" placeholder='email address' />
    <input type="submit" value="Sign Up" class= "button" />
  </fieldset>
</form>


I would wrap your inputs in a div and set the div to display:inline in your css. In your css also target your form and set that to margin:auto


something like this:

<div style="width: 300px; margin-left: auto; margin-right:auto;">
    <form action="signup.php" method="post">
         <fieldset>
          <label>Email: <label>
          <input type="text" name="email" id="email" placeholder='email address' />
          <input type="submit" value="Sign Up" class= "button" />
          </fieldset>
      </form>
</div>
0

精彩评论

暂无评论...
验证码 换一张
取 消