title: How to smoothen div height change after adding content
body: <p>A have a carousel with div that adjusts its height each time the slide changes. The transition, however, is not smooth at all, the borders just jump in and out. How can I make it nice and smooth using css or jQuery? I was thinking about using jQuery's "blind" animation, but I have no idea how to set it up. </p>
  
  <p>Adding "transition: height 2s;" to the div's css rule doesn't do the job either. </p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-css lang-css prettyprint-override"><code>.specs {
   height: 100vh;
      background: url("https://images.unsplash.com/photo-1505663912202-ac22d4cb3707?ixlib=rb-0.3.5&amp;ixid=eyJhcHBfaWQiOjEyMDd9&amp;s=1a078798f813a2aba758a36f972fb0f6&amp;auto=format&amp;fit=crop&amp;w=1500&amp;q=80") no-repeat  center center;
      background-size: cover;
   text-shadow: 1px 1px black;
  }
  
  .backgroundSpecs {
   padding-top: 7vh;
   height: 100%;
   width: 100vw;
   background-color: rgba(57, 56, 56, 0.5);
   display: flex;
      align-items: center;
   justify-content: center;
  }
  
  .fieldsetSpecs {
   height: auto;
   width: 50vw;
      border: 2px solid white;
      padding: 5% 15% 5% 15%;
      color: white;
      text-align: center;
      display: flex;
      justify-content: center;
      transition: height 2s;
  }
  
  .legendSpecs {
   color: white;
   width: auto;
   border: none;
   margin: 0;
   padding: 0 5vw 0 5vw;
  }
  
  /*karuzela specjalizacji*/
  
  .specs #myCarousel2 .carousel-inner .active {
   height: 100%;
   background: none;
  }
  
  .specs #myCarousel2 {
   height: 100%;
  }
  
  .specs .carousel-inner {
   height: 100%;
   display: flex;
   align-items: center;
   justify-content: center;
  }
  
  .specs .carousel-indicators {
   top: -10%;
  }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code> &lt;link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous"&gt;
   &lt;link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.0.13/css/all.css" integrity="sha384-DNOHZ68U8hZfKXOrtjWvjxusGo9WQnrNx2sqG0tfsghAvtVlRW3tvkXWZh58N9jp" crossorigin="anonymous"&gt;
    &lt;div class="specs" id="specs"&gt;
        &lt;div class="backgroundSpecs"&gt;
          &lt;div class="row"&gt;
            &lt;div class="col-lg-12 col-md-12 col-sm-12"&gt;
              &lt;fieldset class="fieldsetSpecs"&gt;
                &lt;legend class="legendSpecs"&gt;SPECJALIZACJE&lt;/legend&gt;
                &lt;div id="myCarousel2" class="carousel slide" data-ride="carousel" data-interval="10000"&gt;
                  &lt;!--CAROUSEL INDICATORS--&gt;
                  &lt;ol class="carousel-indicators"&gt;
                      &lt;li data-target="#myCarousel2" data-slide-to="0" class="active"&gt;&lt;/li&gt;
                      &lt;li data-target="#myCarousel2" data-slide-to="1"&gt;&lt;/li&gt;
                      &lt;li data-target="#myCarousel2" data-slide-to="2"&gt;&lt;/li&gt;
                      &lt;li data-target="#myCarousel2" data-slide-to="3"&gt;&lt;/li&gt;
                  &lt;/ol&gt; 
                  &lt;!--WRAPPER FOR SLIDES--&gt;
                  &lt;div class="carousel-inner" role="listbox"&gt;
  
                      &lt;div class="item active"&gt;
                        &lt;div&gt;
  
                            &lt;h4&gt;Sprawy gospodarcze&lt;/h4&gt;
                            &lt;p&gt;kompleksowa obsługa i doradztwo prawne osób fizycznych i prawnych, polskich i zagranicznych, sporządzenie i opiniowanie umów cywilnoprawnych w językach polskim i angielskim, procesy inwestycyjne, wykonanie i nienależyte wykonanie zobowiązań, egzekucja wierzytelności, due dilligence przedsiębiorstw, prawo nowych technologii, tworzenie i rejestracja spółek, wnioski do KRS, obsługa, fuzji, podziałów i przekształceń podmiotów gospodarczych oraz procesów likwidacji.&lt;/p&gt;
                      &lt;/div&gt;
                      &lt;/div&gt;
                    &lt;div class="item"&gt;
                          &lt;div&gt;
                            &lt;h4&gt;Sprawy z zakresu prawa pracy&lt;/h4&gt;
                        &lt;p&gt;reprezentacja firm w postępowaniach sądowych z zakresu prawa pracy, doradztwo i reprezentacja pracowników w sporach z pracodawcami, nawiązanie stosunku pracy, wynagrodzenie za pracę i inne świadczenia pracownicze, przywrócenie do pracy, odszkodowanie za nieuzasadnione rozwiązanie umowy o pracę, mobbing, sporządzanie i opiniowanie regulaminów pracy, regulaminów wynagradzania oraz układów zbiorowych pracy, pomoc w rozwiązywaniu sporów zbiorowych ze związkami zawodowymi, odszkodowanie należne z tytułu wypadku przy pracy i choroby zawodowej&lt;/p&gt;
                          &lt;/div&gt;
                        &lt;/div&gt;
                      &lt;div class="item"&gt;
                          &lt;div&gt;
                            &lt;h4&gt;Sprawy z zakresu prawa nieruchomości i prawa administracyjnego&lt;/h4&gt;
                        &lt;p&gt;obsługa transakcji sprzedaży, kupna, najmu nieruchomości,  wykonywanie audytów prawnych nieruchomości (due dilligence), doradztwo w celu ograniczenia lub eliminacji ryzyk przy zakupie nieruchomości, obsługa transakcji nieruchomości, obsługa prawna wspólnot mieszkaniowych oraz członków wspólnot mieszkaniowych w sprawach dotyczących m.in. służebności, zniesienia współwłasności, eksmisji, robót budowlanych, reprezentowanie przed organami administracyjnymi, w tym przed organami nadzoru budowlanego, organami architektoniczno-budowalnymi w trakcie całego procesu budowlanego, reprezentacja w postępowaniach administracyjnych i sądowo-administracyjnych&lt;/p&gt;
                          &lt;/div&gt;
                      &lt;/div&gt;
                      &lt;div class="item"&gt;
                          &lt;div&gt;
                            &lt;h4&gt;Sprawy cywilne&lt;/h4&gt;
                        &lt;p&gt;sprawy o zapłatę, wykonanie/niewykonanie/nienależyte wykonanie umów i zobowiązań , dochodzenie odszkodowań, zadośćuczynień (wypadki komunikacyjne, szkody osobowe, szkody majątkowe), sprawy dotyczące nieruchomości i praw rzeczowych (zasiedzenie, służebności, zniesienie współwłasności nieruchomości, wydanie nieruchomości, ochrona posiadania), spadki (stwierdzenia nabycia spadku, dział spadku, zachowek,  testament,  wydziedziczenie)&lt;/p&gt;
                          &lt;/div&gt;
                        &lt;/div&gt;
                  &lt;/div&gt;
                &lt;/div&gt;
              &lt;/div&gt;
            &lt;/fieldset&gt;
          &lt;/div&gt; 
        &lt;/div&gt;
      &lt;/div&gt;
    
  &lt;script type = "text/javascript" src = "https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"&gt;&lt;/script&gt;
      &lt;script type = "text/javascript" src = "https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.3/jquery-ui.min.js"&gt;&lt;/script&gt;
      &lt;script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS" crossorigin="anonymous"&gt;&lt;/script&gt;
   &lt;script type="text/javascript" src="scripts.js"&gt;&lt;/script&gt;  
    </code></pre>
  </div>
  </div>
  </p>