Question

这里我有一个表单。它有一些标签和输入元素。我有一个包装器div，它应该完全包装它的子元素（在我的情况下是标签和输入元素）。但它只是包装标签元素。我也需要它来覆盖输入元素。它如何解决？

<style>
  #mydiv{
     width:350px;
     height:550px;

     background:#d3a625;
     position:fixed;
     top:70px;
     left:300px;
     position:relative;

  }

  #mydiv input{

       position:absolute;
       right:0px;
       margin-left:15px;
  }
  #image{
     width:60px;
     height:60px;
     border:1px solid black;
  }
    .whole{
     border:1px solid black;
     position:relative;
     width:100%;
     height:50px;
     background:skyblue;
  }
  .design{
     color:white;
     font-size:25px;
     position:relative;
     left:30px;

  }
  .field{
     width:70%;
     height:60px;
     font-style:bold;


  }
  .wrapper{
    position:relative;
    right:40px;
  }

</style>
</head>
<body>
<form action='<?php echo $_SERVER['PHP_SELF']; ?>' id='mydiv' method='post' enctype='multipart/form-data'>
   </br>
   <div class='whole'>
        <div class='design'>
            <label for='username'>username</label>
        </div>
        <div class='wrapper'>
             <input type='text' class='field' name='username' value='' autocomplete='off'>
        </div>
   </div>
   </br>
   </br>
   <div class='whole'>
        <div class='design'>
            <label for='password'>password</label>
        </div>
        <div class='wrapper'>
            <input type='password' class='field' name='password' value='' autocomplete='off'>
        </div>
   </div>
   </br>
   </br>
   <div class='whole'>
        <div class='design'>
            <label for='password_again'>password_again</label>
        </div>
        <div class='wrapper'>
            <input type='password' class='field' name='password_again' value='' autocomplete='off'>
        </div>
   </div>
   </br>
   </br>
   <div class='whole'>
        <div class='design'>
            <label for='name'>Full Name</label>
        </div>
        <div class='wrapper'>
            <input type='text' class='field' name='name' value='' autocomplete='off'>
        </div>
   </div>
   </br>
   </br>
   <div id='button'>
       <input type='submit' value='register' >
   </div>
   <input type='hidden' name='token' value="<?php echo Token::generate(); ?>">


</form>

Answer 1

它没有包装输入字段，因为您将div的高度（class =＆＃39;整数＆＃39;）设置为50px。您可以删除height属性或将其设置为auto。

包装div并不能完全扼杀它的内心

1 个答案: