div w divie wyjeżdza za div

Mam taki problem mam sobie divy

<div id=glowna>
<div id=menu-gorne2>ss</div>
<div id=kategoria>
  <div id=ikona></div>
  <div id=pozycja><span class=tytul_kategoria>Tytul kategoria</span></div>
  <div id=pozycja2></div>
  <div id=pozycja3></div>
</div>
 
<div id=kategoria>
  <div id=ikona></div>
  <div id=pozycja></div>
  <div id=pozycja2></div>
  <div id=pozycja3></div>
</div>
<br>
</div>

Tu jest css do tych divów

#glowna {
  
     padding:0px;
     background-color:#DFFFCC;
      overflow: visible;

     min-height: 250px;
     margin: 0 auto;
     width: 1200px;
     border-top-left-radius: 22px;
     border-top-right-radius: 22px;
     border-bottom-right-radius: 22px;
     border-bottom-left-radius: 22px;
     
  

}
  
  body {
      
      background-color: #4991c9; 
    
  }
  
 
#menu-gorne {
padding:5px;
width: 1190px;
  min-height: 100px;
  border-top-left-radius: 22px;
     border-top-right-radius: 22px;


}

#menu-gorne2 {
padding:5px;
width: 1190px;
  min-height: 40px;
  border-top-left-radius: 22px;
     border-top-right-radius: 22px;
    background-color: #45704f; 

}

#kategoria {
padding:0px;
width: 1200px;
  min-height: 60px;
    background-color: #b4d5a0; 
    margin-bottom: 2px;

}
#ikona {
float: left;
padding:0px;
width: 100px;
  min-height: 60px;
    background-color: #b4d5a0; 

}
#pozycja {
float: left;
padding:6px;
width: 528px;
  min-height: 48px;
    background-color: #768a6a; 

}
#pozycja2 {
float: left;
padding:0px;
width: 230px;
  min-height: 60px;
    background-color: #b4d5a0; 

}
#pozycja3 {
float: left;
padding:0px;
width: 330px;
  min-height: 60px;
    background-color: #768a6a; 

}
#menu {
      margin-left: 0px;
     display:flex;
     display:-webkit-flex;
  width: 1200px;
  min-height: 100px;
  background-color:#45704f;
  
  
  
}

I teraz problem w tym, że jak będzie za dużo tesktu to w divie o id pozycja to ten div się powiększy natomiast nadrzędne divy się nie powiększą, a jak zrobić, żeby automatycznie się ten div powiększył i nadrzędne.