文章/答案/技术大牛

发布

社区首页 >问答首页 >使文本框和按钮占据整个div

问使文本框和按钮占据整个div
EN

Stack Overflow用户

提问于 2020-10-21 06:25:55

回答 2查看 38关注 0票数 0

我希望文本框和按钮都占用整个div (这是彩色的)，只使用bootstrap。下面我向您展示我的屏幕截图：https://postimg.cc/yJcPtVSg。我已经尝试了几种方法(放置col-12)，但都没有成功。这是我的代码：

<html>
    <head>
    <meta charset="UTF-8">
    <title></title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="css/jquery-ui.css" />
    <script src="js/jquery-1.9.1.js"></script>
    <script src="js/jquery-ui.js"></script>    
    <LINK REL=StyleSheet HREF="css2/bootstrap.css" TYPE="text/css">
    </head>
    <body>
<div class="container" style='height:600px;'>
    <div class='row h-100 '>
    <div class='col bg-danger  my-auto d-flex  justify-content-center alig-items-center '>    
        <form action="lineas.php" method="post">
    <div class ='row m-3 '>
        <?php  echo("Elige origen: ");?>  
        <input type="text" id="origen" name="origen" class="form-control ">
    </div>
    <div class ="row m-3">  
        <?php  echo("Elige destino: ");?>  
        <input type="text" id="destino" name="destino" class="form-control">
    </div>
    <div class ="row m-3">
            Selecciona una fecha:    <input type="text" id="datepicker" name="fecha" class="form-control">
    </div>
    <div class ="row m-3">   
        <input type="submit" name="enviar" value="Enviar" class="btn btn-primary btn-block">
    </div>            
        </form>
        <script src="js2/popper.min.js"  type="text/javascript"></script>
        <script src="js2/utilidades.js"  type="text/javascript"></script>
    </div>
    </div>
</div>                 
</body>
</html>

php

html

css

回答 2

Stack Overflow用户

发布于 2020-10-21 13:08:11

添加此CSS。

 .full-width {
      width: 100vw;
      position: relative;
      left: 50%; /* adds left 50% to the element */
      right: 50%; /* adds right 50% to the element */
      margin-left: -50vw; /* it works as left: 0 */
      margin-right: -50vw; /* it works as right: 0 */
   }

票数 0

Stack Overflow用户

发布于 2020-10-21 12:38:57

在form之前添加一个class = "container“的div。看起来不错

票数 -1

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/64454176

复制

相似问题

问使文本框和按钮占据整个div
EN

回答 2

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问使文本框和按钮占据整个divEN

回答 2

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问使文本框和按钮占据整个div
EN