Podstawy CSS

[Początkujący]

Mam kolejny problem z padding. Z jakiegoś powodu <div> nie chce być jednolicie wyrównana, ustawiłem 100px od top i bottom a założonego efektu nie ma.

Kod:

<div id="content">
        <div id="top">
            <div id="logo"><img src="m.jpg"></div>
            <div id="on">Finlandia to kraj tysiąca jezior, który charakteryzuje się nieskazitelną przyrodą oraz malowniczymi krajobrazami. Wydawać by się mogło, że tego typu stwierdzenie idealnie określa państwo, którego główną gałęzią gospodarczą jest turystyka.</div>
</div>
</div>

Kod:

#content {
    margin: auto;
    text-align: left;
    width: 960px;
    background-color: yellow;
    overflow: hidden;
}
#top {
    width: 960px;
    padding: 100px 0;
    }
#logo {
    float: left;
    width: 480px;
}
    
#on {
    float: right;
    width: 480px;
    text-align: right;
}