Obramowanie, aby się powiekszało automatycznie

witam serdecznie,
mam 1 pytanko. Jak dostosować obramowanie głównego div-a , aby tekst umieszczony w innym div nie wychodził poza głównym dive-m. Inaczej mówiąc, główny div zwiększył swój wymiar dostosowanie do tekstu. Plik css przedstawia się następująco:

a {
    text-decoration:none;
}
img{
    border:  solid 0px;
}


#All {
    font-size: 30px;
    width: 900px;
    margin-left: 220px;
    height:  auto;
    border-style: groove ridge inset outset
}
ul {
    list-style-type: none;
}

#Top {
}

#LeftMenu {
    width: 49%;
    float: left;
}
#CenterMenu {
    clear: both;
}
#Content {
    width: 50%;
    float: left;
}

obraz strony znajduję się w załączniku

Proszę uprzejmie o podpowiedz?

Jaką tam w ogóle masz strukturę HTML? I co to jest "główny div"? Nie masz tu żadnego elementu #Main. Może chodzi Ci o #Content, może o #All, a może nie -- w każdym razie proszę pisać jednoznacznie. Napisanie "#Content" jest nawet prostsze niż "główny div". Strona najwyraźniej związana z jurystami, a oni mają z programistami to wspólnego, że jednoznaczność jest dla nich bardzo ważna :).

Generalnie domyślam się, że brakuje Ci tam clearfixa. Pogooglaj: css clearfix. Albo po prostu daj elementowi, którego obramowanie ma się rozciągnąć (czyli temu #All czy coś) overflow: hidden. W większości przypadków styka.

super, dziękuje serdecznie za wskazówkę . DZIAŁA !
Dodałam do głównego div-a , który zawiera cała stronę

overflow: hidden;