Question

如何阻止这种情况发生？

这是我联系我们表格的代码。我正在使用bootstrap。当我扩展文本区域时，它跨越了分区。我可以通过添加内联CSS在textarea内部尝试吗？

<div id="content">
  <div class="container">
    <div class="col-md-12">
      <ul class="breadcrumb">
        <li><a href="index.php">Home</a></li>
        <li><a href="index.php">Contact Us</a></li>

      </ul>
      <!--breadcrumb ends--->
    </div>
    <!---col-md-12 ends-->
    <div class="col-md-3">
      <?php include("sidebar.php"); ?>
    </div>
    <!--col-md-3 ends--->


    <div class="col-md-9">
      <div class="box">
        <div class="box-header">
          <center>
            <h2>Contact Us</h2>
            <p class="text-muted">
              Getting you the products and solutions you need to get the job done is ours rep’s first priority. Whether you have specific product questions or need more information on volume pricing, our rep has everything you need to keep your job running on time,
              on budget and on target. <br> If you have any questions,please feel free to contact us,our customer service center is working for you 24/7.
            </p>
          </center>
        </div>
        <!--box-header ends-->
        <form action="contact.php" method="post">
          <div class="form-group">
            <label>Name</label>
            <input type="text" class="form-control" name="name" required>
          </div>
          <!--form group--->

          <div class="form-group">
            <label>Email</label>
            <input type="text" class="form-control" name="email" required>
          </div>
          <!--form group--->


          <div class="form-group">
            <label>Subject</label>
            <input type="text" class="form-control" name="subject" required>
          </div>
          <!--form group--->


          <div class="form-group">
            <label>Message</label>
            <textarea class="form-control" name="message"></textarea>
          </div>
          <!--form group--->

          <div class="text-center">
            <button type="submit" class="btn btn-primary" name="submit">
    <i class="fa fa-user-md"></i>Send Message</button>
          </div>
          <!--text-center-->

        </form>
        <!--form ends-->
      </div>
      <!--box ends-->
    </div>
    <!--col-m-9 ends-->

Answer 1

点击此链接＆＃34;试试这将有助于How can I prevent the textarea from stretching beyond his parent DIV element? (google-chrome issue only)＆＃34;或尝试以下代码

你可以限制尺寸：

textarea {
    max-width: 100px; 
    max-height: 100px;
}

限制父母宽度和/或身高的大小：

textarea {
    max-width: 100%; 
    max-height: 100%;
}

textarea穿过div部分

1 个答案: