¿Por qué es el cuadro de texto en mi forma de no estirar más en pantalla a tamaño completo? Parece más bien corto!

<!-- row: 4 -->
<div class="row base-padding fill-dark">
    <div class="col-md-8 no-padding">
        <h2 class="white base-padding-bottom">SIGN UP FOR OUR NEWSLETTER</h3>
        <p class="light-grey">Receive exclusive promotions, <strong>free passes</strong> for <strong>family and friends</strong> and links to our weekly ad!</p>
        <br>
    </div>
    <div class="col-md-4 no-padding">
        <h2 class="white base-padding-bottom">EMAIL ADDRESS</h3>
        <form class="form-inline" role="form">
            <div class="form-group">
                <label class="sr-only" for="exampleInputEmail2">Email address</label>
                <input type="email" class="form-control" id="exampleInputEmail2" placeholder="Enter email">
            </div>
            <button type="submit" class="btn btn-default">Sign in</button>
        </form>
    </div>
</div>

OriginalEl autor | 2014-03-04

1 Comentario

  1. 9

    Cuando utilice el formulario en línea incluido en Bootstrap, usted tiene que fijar el ancho de la input manualmente.

    A partir de la documentación de Bootstrap:

    Entradas, selecciona, y textareas son 100% de ancho por defecto de inicio. Para utilizar el formulario en línea, usted tendrá que establecer una anchura en los controles de formulario utilizado dentro.

    Parece que usted necesita para usar un píxel (px) de valor para la configuración de la input ancho. Cuando yo intente configurarlo con un valor de porcentaje no funciona correctamente, al menos en mi final.

    Si usted agregar algo como esto en su hoja de estilo, usted debería ser capaz de cambiar el tamaño del cuadro de texto como se necesite. Acaba de cambiar el 256 a todo el tiempo que necesite.

    .form-inline .form-control {
    width: 256px;
    }

    Si entiendo el Bootstrap de la documentación correctamente, no utilice el .form-inline estilo en pantallas más pequeñas (<768px de ancho), por lo que debe estar bien allí. Espero que esto ayude.

    Esto es algo útil, pero para ser sensible, ¿cómo puedo hacer que un mismo ancho como col-md-8 en porcentaje??

    OriginalEl autor Jack Bonneman

Dejar respuesta

Please enter your comment!
Please enter your name here