Buenas amigos.
Hace poco empece a utilizar bootstrap logrando programar muy rapido algunos formularios. Estoy con un problema de diseño en cuanto a una tabla que quiero dejarla en el medio de la fila de 12 columnas de mi ventana modal, y no logro como poder hacerlo. Este es el codigo que tengo:
La tabla que esta al ultimo, no puedo hacer que sea mas pequeña cada una de las celdas y que este al medio de esa fila.
No busco que me resuelvan este problema, si alguien fuera tan amable de explicarme como puedo hacerlo y lograr entender las grillas, puff me aliviarian un grande.
Saludos Amigos y muchas gracias por sus ayudas.
PD: Este codigo solo lo tengo asi para poder diseñar mis ventanas y asi probar como se ven cuando las estoy diseñando.
Hace poco empece a utilizar bootstrap logrando programar muy rapido algunos formularios. Estoy con un problema de diseño en cuanto a una tabla que quiero dejarla en el medio de la fila de 12 columnas de mi ventana modal, y no logro como poder hacerlo. Este es el codigo que tengo:
HTML:
<html lang="es">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- Bootstrap -->
<link href="../bootstrap/css/bootstrap.min.css" rel="stylesheet">
<link href="../bootstrap/css/style_nav.css" rel="stylesheet">
</head>
<body>
<button type="button" class="btn btn-primary" data-toggle="modal" data-target="#basicExample">Launch demo modal</button>
<div class="modal fade" id="basicExample" tabindex="-1" role="form" aria-labelledby="exampleModalLabel" aria-hidden="false">
<div class="modal-dialog form" role="document">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">Modal Title</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
</div>
<div class="modal-body">
<div class="form-group input-sm">
<label class="col-sm-3 control-label input-sm">Rut :</label>
<div class="col-sm-9">
<input type="text" name="rut_operador" class="form-control input-sm" placeholder="Rut">
</div>
</div>
<div class="form-group input-sm">
<label class="col-sm-3 control-label input-sm">Nombre :</label>
<div class="col-sm-9">
<input type="text" name="nommbre_operador" class="form-control input-sm" placeholder="Nombre">
</div>
</div>
<div class="form-group input-sm">
<label class="col-sm-3 control-label input-sm">Apellido :</label>
<div class="col-sm-9">
<input type="text" name="apellido_operador" class="form-control input-sm" placeholder="Apellido">
</div>
</div>
<div class="form-group input-sm">
<label class="col-sm-3 control-label input-sm">Telefono :</label>
<div class="col-sm-9">
<input type="text" name="telefono_operador" class="form-control input-sm" placeholder="Telefono">
</div>
</div>
<div class="form-group input-sm">
<label class="col-sm-3 control-label input-sm">Nombre de Uusuario :</label>
<div class="col-sm-9">
<input type="text" name="nombre_usuario" class="form-control input-sm" placeholder="Usuario">
</div>
</div>
<div class="form-group input-sm">
<label class="col-sm-3 control-label input-sm">Clave :</label>
<div class="col-sm-9">
<input type="text" name="clave_usuario1" class="form-control input-sm" placeholder="Clave">
</div>
</div>
<div class="form-group input-sm">
<label class="col-sm-3 control-label input-sm">Reescribir Clave :</label>
<div class="col-sm-9">
<input type="text" name="clave_usuario2" class="form-control input-sm" placeholder="Reescribir Clave">
</div>
</div>
<div class="row-sm-9">
<table class="table table-bordered table-condensed">
<tr>
<th><span class="glyphicon glyphicon-plus"></span></th>
<th><span class="glyphicon glyphicon-pencil"></span></th>
<th><span class="glyphicon glyphicon-remove"></span></th>
<th><span class="glyphicon glyphicon-eye-open"></span></th>
</tr>
<tr>
<td><input type="checkbox"></td>
<td><input type="checkbox"></td>
<td><input type="checkbox"></td>
<td><input type="checkbox"></td>
</tr>
</table>
</div>
</div>
<div class="modal-footer">
<input type="button" value="Guardar">
</div>
</div>
</div>
</body>
<script src="../jquery/3.2.1/jquery.min.js"></script>
<script src="../bootstrap/js/bootstrap.min.js"></script>
</html>La tabla que esta al ultimo, no puedo hacer que sea mas pequeña cada una de las celdas y que este al medio de esa fila.
No busco que me resuelvan este problema, si alguien fuera tan amable de explicarme como puedo hacerlo y lograr entender las grillas, puff me aliviarian un grande.
Saludos Amigos y muchas gracias por sus ayudas.
PD: Este codigo solo lo tengo asi para poder diseñar mis ventanas y asi probar como se ven cuando las estoy diseñando.
