Columna de Ancho fijo de una Tabla - CSS HTML

Tengo un Navbar y debajo tengo una tabla con 2 columnas la primera de un ancho de 15% y la segunda de 85%. El detalle es que cuando yo reduzco el navegador, ese ancho también se me reduce. Lo que deseo es que mi tabla se queda quiet

<table cellpadding="0" cellspacing="0" style="width:100%; height: 91.759%; margin-top: -20px; font-size: 14px;table-layout: fixed">
    <tr>
        <td align="left" valign="top" style="width:15%; background: #FFFFFF;border-right: 1px solid #e2e2e2; border-bottom: 1px solid #e2e2e2;">
           <div style="position: fixed; padding-top: 20px; padding-left: 20px; padding-right: 20px;">
    <form role="form" name="consulta" action="" method="post">
    <div class="form-group2">
    <label for="departamento" >Departamento:</label>           
    <select name="departamento" class="form-control2" id="departamento">
    <option>Madre de Dios</option>
    <option>La segunda opción</option>
    <option>La tercera opción</option>
    </select>
    </div>
    <div class="form-group2">
    <label for="sitio" >Sitio:</label>           
    <select name="sitio" class="form-control2" id="sitio">
    <option>La primera opción</option>
    <option>La segunda opción</option>
    <option>La tercera opción</option>
    </select>
    </div>
    <center><button type="submit" class="btn btn-default">Buscar</button></center>
    </form>
    </div>
        </td>
        <td width="85%" >   
        </td>
    </tr>
</table>         

a o estática a cualquier cambio de tamaño del navegador.

1 Respuesta

Respuesta
1

El primer lío lo tienes porque en una columna defines el ancho con la propiedad width dentro de style y en la otra lo defines directamente con la propiedad width. Realmente no se si he entendido el objetivo de la pregunta. ¿Deseas qué una de las columnas tenga un ancho fijo y la otra ocupe el resto del ancho?. Si es así, el método sería:

<table cellpadding="0" cellspacing="0" style="width:100%">
  <tr>
    <td align="left" valign="top" style="width:200px">
      Contenido columna 1
    </td>
    <td style="width:auto" >   
      Contenido columna 2
    </td>
  </tr>
</table>

De esta forma la primera columna tendria un ancho fijo de 200 y la segunda ocuparía el resto del ancho.

Salu2.

Añade tu respuesta

Haz clic para o

Más respuestas relacionadas