none
DIV que condiciona el tamaño de la página RRS feed

  • Pregunta

  • Hola a todos, tengo el siguiente diseño:

         <div id="Principal">

             <div id="zona izquierda">A</div>

            <div id="zona centro"><p id="TextoPrin">//p></div>

             <div id="zona izquierda">A</div>

         </div>

    y en los estilos #Principal tiene min-height:500px

    El problema que tengo es que si desde JQuery capturo el párrafo TextoPrin y le añado un texto muy largo que sobrepasa el tamaño completo de la pantalla, en dicha capa solo se presentan los caracteres que caben en pantalla, pero no consigo que la página se adapte y crezca al hacerlo el contenido.

    Gracias 

    martes, 5 de abril de 2016 21:31

Respuestas

Todas las respuestas

  • Hola,

    Primeramente comentarte que el id, debe ser único, si deseas asignar a varios elementos usa class

       <div id="Principal">
             <div class="zona izquierda">A</div>
             <div class="zona centro"><p id="TextoPrin"></p></div>
             <div class="zona izquierda">A</div>
       </div>

     [-] ... y en los estilos #Principal tiene min-height:500px

    div#Principal{
      height: auto;
       min-height: 500px;
    }

    div#Principal .zona{ height: auto;

    }

    Si no te ayuda, puedes mostrar como es tu aplicación, para darnos una idea más clara.

    Saludos.



    JC NaupaCrispín


    martes, 5 de abril de 2016 21:48
  • Si perdona mi código era incorrecto por copiar y pegar y no corregir luego mi código correcto es

      <div id="Principal">

             <div id="zona_izquierda">A</div>

            <div id="zona_centro"><p id="TextoPrin"></p></div>

             <div id="zona_derecha">C</div>

         </div>

    y mi problema es que si alguno de los contenidos de una de las zonas sobrepasa el tamaño de la pantalla el navegador no hace crecer la página de forma que ocupe más de una pantalla, ni le añade barras de scroll, ya he probado con el height:auto y eso no funciona y ahora estoy investigando las opciones de overflow.

    Gracias

    martes, 5 de abril de 2016 22:03
  • Hola,

    Puedes usar overflow-y: scroll, para añadir un scroll vertical, cuando el contenido sea mayor al contenedor.

    Saludos.


    JC NaupaCrispín

    martes, 5 de abril de 2016 22:12
  • hola

    overflow | CSS-Tricks

    cuando el tamaño del un div sobrepasa a su container debes habilitar los scroll

    Overflow Example

    saludos


    Leandro Tuttini

    Blog
    MVP Profile
    Buenos Aires
    Argentina

    • Marcado como respuesta fjjcent miércoles, 6 de abril de 2016 10:02
    miércoles, 6 de abril de 2016 0:24
  • Efectivamente con overflow-y:auto y estableciendo el tamaño del DIV fijo aparece la barra de scroll vertical

    Gracias

    miércoles, 6 de abril de 2016 10:02