Strona 1 z 1

Automatyczna wysokosc

Napisane: środa, 13 kwietnia 2011, 22:49
przez Lenson
W jaki sposób mogę zrobić automatyczna wysokość jeżeli mam główny_box_tekst podzielony w srodku na _lewo i _prawo ?? jak mam all w głównym to powieksza , ale jak juz wrzuce w lewo albo prawo , to nie chce

Re: Automatyczna wysokosc

Napisane: czwartek, 22 września 2011, 15:16
przez Morfidon
Czasem jest ciężko to uzyskać, jeśli korzystasz z jQuery to możesz skorzystać np. z funkcji, którą napisałem:

Code: Zaznacz cały

function minHeight(minHeight, idOfDivToResize)
{ 
	if ( parseInt($("#"+idOfDivToResize).css("height")) < minHeight) 
           $("#"+idOfDivToResize).css("height", minHeight+"px");	
}
W większości wypadków nie trzeba korzystać z tego typu funkcji, można skorzystać

Code: Zaznacz cały

clear: both;
stawiając jakiś "pusty" element "po" wszystkich divach, przez co do tego elementu poprzednie elementy będą próbowały zawsze mieć minimalny height.

Sorry, że teraz - nie zauważyłem topic'u.

Re: Automatyczna wysokosc

Napisane: poniedziałek, 13 maja 2013, 17:01
przez Morfidon
Możesz to zrobić zamiast tak:

Code: Zaznacz cały

<div id="mainDiv">            
<div id="leftColumn">asfasf</div>
<div id="rightColumn">asfasf</div>
To jest inny div w srodku
<div style="clear: both;"></div>
</div>
jeszcze tak:

Code: Zaznacz cały

<div id="mainDiv" class="clearfix">
            
<div id="leftColumn">asfasf</div>

<div id="rightColumn">asfasf</div>
To jest inny tekst w srodku
</div>

Code: Zaznacz cały

.clearfix:before,
.clearfix:after {
    content: " "; 
    display: table; 
}

.clearfix:after {
    clear: both;
}
#mainDiv
{
    background-color: red;
    width: 800px;
}

#leftColumn
{
    width: 100px;
    height: 300px;
    background-color: blue;
    float: left;
}
#rightColumn
{
    background-color: green;
    width: 100px;
    height: 300px;
    float: right;
}
lub tak:

Code: Zaznacz cały

function fix_heights(query)
{
      var i = 0;
      var maxHeight = "";
      $(query).each(function()
      {
         var height = $(this).css("height");
         if (i == 0)
            maxHeight = height;
         
         if (maxHeight < height)
             maxHeight = height;
         i++;
      }).each(function()
      {          
          $(this).css("height", maxHeight);
      });
}

$(document).ready(function()
{ 
        fix_heights("#middle_flow > *");        
  
});