如何解决使文本框和按钮占据整个div
我希望文本框和按钮都仅使用引导程序来占据整个div（彩色）。在这里，我向您显示屏幕截图：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>
解决方法
添加此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 */
}
在表格前添加另一个class =“ container”的div。它会工作
版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 dio@foxmail.com 举报，一经查实，本站将立刻删除。
