Flere div inde i en omklamrende div

Hej eksperter

Når jeg smider mere en to divs ind i en omklamrende div, så bliver min
omklamrende div automatisk større end hvad jeg har skrevet den til.

Den omklamrende div er #home


Det står fint med:

#home { */den omklamrende div /*
    border : solid 7px #F1DB86;
    padding : 0px;
    height: 350px;
    width: 670px;
    position: relative;
    background-image: url(home.jpg);
    margin: 0 auto;
    text-align: left;
}

#logo {
    border : solid 2px #F1DB86;
    height: 25px;
    width: 250px;
    position: relative;
    top: 200px;
    left: 50px;
    padding : 0px;
}

#maerker {
    border : solid 2px #F1DB86;
    height: 320px;
    width: 300px;
    position: relative;
    top: -10px;
    left: 360px;
    padding : 0px;
}

html:

<div id="home">
<div id="logo">
  <p class="style3">LUXundPUNK</p></div>
<div id="maerker"></div>
</div>

Men når jeg så gør følgende:

#home {
    border : solid 7px #F1DB86;
    padding : 0px;
    height: 350px;
    width: 670px;
    position: relative;
    background-image: url(home.jpg);
    margin: 0 auto;
    text-align: left;
}

#logo {
    border : solid 2px #F1DB86;
    height: 25px;
    width: 250px;
    position: relative;
    top: 200px;
    left: 50px;
    padding : 0px;
}

#maerker {
    border : solid 2px #F1DB86;
    height: 320px;
    width: 300px;
    position: relative;
    top: -10px;
    left: 360px;
    padding : 0px;
}

#adr { */den nye div inde i den omklamrende div /*
    border : solid 2px #F1DB86;
    height: 40px;
    width: 300px;
    position: relative;
    top: 225px;
    left: 40px;
    padding : 0px;
}

html:

<div id="home">
<div id="logo">
  <p class="style3">LUXundPUNK</p></div>
<div id="maerker"></div>
<div id="adr"></div>
</div>

så skubber den det hele ??? Hvad kan jeg gøre for at dette
ikke sker ?