-1

I am trying to align div element centre vertically using below code but it's not working I am trying to get this since a long time but no result can someone help me please where did I do my stack and how can I

.center {
    padding: 10px 0;
    border: 3px solid green;
    margin-left:10px;
    margin-right:10px;
  }
 
<!DOCTYPE html>
    <html>
    <head>
    </head>
    <body>
    
    <h2>Center Vertically</h2>
    <p>In this example, we use the padding property to center the div element vertically:</p>
    
    <div class="center">
      <p>I am vertically centered.</p>
      <form action="/action_page.php">
      <fieldset>
        <legend>Personal information:</legend>
        First name:<br>
        <input type="text" name="firstname" value="Mickey"><br>
        Last name:<br>
        <input type="text" name="lastname" value="Mouse"><br><br>
        <input type="submit" value="Submit">
      </fieldset>
    </form>
    </div>
    
    </body>
    </html>

solve this?

https://www.w3schools.com/code/tryit.asp?filename=FYB6T0NY6DTE

Arshiya Khanam
  • 613
  • 6
  • 12
AbhiRam
  • 2,033
  • 7
  • 41
  • 94

1 Answers1

0

    <!DOCTYPE html>
    <html>
    <head>
    <style>
    .center {
      position: relative;
      padding: 10px 0;
      border: 3px solid green;
      top: 50%;
      transform: translateY(-50%);
    }
    </style>
    </head>
    <body>
    
    <h2>Center Vertically</h2>
    <p>In this example, we use the padding property to center the div element vertically:</p>
    
    <div class="center">
      <p>I am vertically centered.</p>
      <form action="/action_page.php">
      <fieldset>
        <legend>Personal information:</legend>
        First name:<br>
        <input type="text" name="firstname" value="Mickey"><br>
        Last name:<br>
        <input type="text" name="lastname" value="Mouse"><br><br>
        <input type="submit" value="Submit">
      </fieldset>
    </form>
    </div>
    
    </body>
    </html>
Julian
  • 1,592
  • 1
  • 13
  • 33
Ramon de Vries
  • 1,312
  • 7
  • 20