CSS ile divi büyütme

<div class="ackapa">Üzerine Gel</div>
    <div class="tasiyici">Bu alan istenildiğinde açılıp kapatılacktır.Word, belgenizin profesyonelce üretilmiş görünmesini sağlamak için birbirini tamamlayan üst bilgi, alt bilgi, kapak sayfası ve metin kutusu tasarımları sağlar. Örneğin, birbiriyle uyumlu bir kapak sayfası, başlık ve kenar çubuğu ekleyebilirsiniz. Ekle'ye tıklayın ve ardından farklı galerilerden eklemek istediğiniz öğeleri seçin.
    Temalar ve stiller de belgenizin düzenli kalmasına yardımcı olur. Tasarım'a tıklayıp yeni bir Tema seçtiğinizde, resimler, grafikler ve SmartArt grafikleri, yeni temanızla eşleşecek şekilde değiştirilir. Stilleri uyguladığınızda, başlıklarınız yeni tema ile eşleşecek şekilde değiştirilir.
    Word'de ihtiyaç duyduğunuz yerlerde görüntülenen yeni düğmeler sayesinde zaman kazanın. Bir resmin belgenize sığma şeklini değiştirmek için resme tıklayın. Resmin yanında bir düzen seçenekleri düğmesi belirir. Bir tablo üzerinde çalışırken, bir satır veya sütun eklemek istediğiniz yere tıklayın ve ardından artı işaretine tıklayın.
    Yeni Okuma görünümünde okumak da daha kolaydır. Belgenin bölümlerini daraltabilir ve istediğiniz metne odaklanabilirsiniz. Sona ulaşmadan önce okumayı durdurmanız gerekirse, Word farklı bir cihazda bile kaldığınız yeri hatırlar.
</div>
<div class="sonraki">
Bir tablo üzerinde çalışırken, bir satır veya sütun eklemek istediğiniz yere tıklayın ve ardından artı işaretine tıklayın.
Yeni Okuma görünümünde okumak da daha kolaydır. Belgenin bölümlerini daraltabilir ve istediğiniz metne odaklanabilirsiniz. Sona ulaşmadan önce okumayı durdurmanız gerekirse, Word farklı bir cihazda bile kaldığınız yeri hatırlar.
</div>

.ackapa{
    background: darkred;
    padding: 5px;
    margin :5px;
    color: white;
    font-weight: bold;
    display: block;
    width: 150px;
    height: 30px;
    text-align: center;
    line-height: 30px;
}
.ackapa:hover .tasiyici{
     width: 600px;
     height: 250px;
}
.tasiyici{
    font-weight: thin;
    margin-top: 10px;
    width: 0px;
    height: 0px;
    background: red;
    overflow: hidden;
 }

.ackapa:hover ~ .tasiyici{
...
}
.tasiyici{
  transition:all 1s;
...

.tasiyici:hover {
     width: 600px;
     height: 250px;
     display: inline-block;
     text-align: justify;
     padding: 10px;
     overflow: auto;
 }