首页 > 解决方案 > Div 类最小宽度仍在调整大小

问题描述

美好的一天,所以我有一个包含在 div 标签中的登录功能。如果我调整大小,我只想冻结 div。我尝试添加 min-width 和 display: inline-block 但它仍在调整大小。任何帮助,将不胜感激。此外,使用像素值仍然不起作用。

在此处输入图像描述

屏幕截图显示 min-width:300% !important; 不工作。

我还将我的代码放在 JS Fiddle 中:https ://jsfiddle.net/wvhgsek9/

HTML:

  <form class="reg_log_box login_box form-group">
        <br>
        <div class="row">
          <div class="col-md-12">
            <p>EMAIL</p>
            <input type="text" placeholder="EMAIL" autocomplete="off" name="email"
            value="<?php
              if(isset($_POST["email"])) {
                echo($_POST["email"]);
              } ?>">
          </div>
          <div class="col-md-12">
            <p>PASSWORD</p>
            <input type="text" placeholder="PASSWORD" autocomplete="off" name="password">
          </div>
        </div>
          <input type="submit" id="login" name="login" value="LOGIN" class="reg_signup">
          <p class="center_font">NO ACCOUNT YET? <a href="register.php">REGISTER HERE</a></p>
        <br>
    </form>

CSS:

.login_box {
      min-width: 30% !important;
      display: inline-block
    }

    .reg_log_box {
      width: 50%;
      padding: 10px 70px 10px;
      background: #fff;
      opacity: 0.9;
      border-radius: 30px;
      margin: 0 auto;
    }

标签: htmlcssbootstrap-4

解决方案


尝试resize: block;

block 该元素显示一种机制,允许用户在块方向上调整其大小(水平或垂直,取决于书写模式和方向值)。

https://developer.mozilla.org/en-US/docs/Web/CSS/resize


推荐阅读