Unnamed

#menu {
background: url('yoyo.jpg') 50% 0;
width:some width;
min-height: some height;
}

now you know that it will change when i do
<div id="menu">aaa<br>AAAAAAAA<br>AAAAA</div>
( like size of that menu )
now wouldnt it be possible to somehow implement this to it?
#menu h1 {
text-size:12px;
padding: 10px;
}
and now do <div id="menu"><h1>teext<br>teeext2<br>teeex3</h1>
but now the size of the #menu wont change.. why's so?