DIV+CSS背景问题

不正常:

< style > ...
#main {...}{background:red}
#nav {...}{background:green;float:right}
#content {...}{background:blue}
</ style >
< div  id ="main" >
     < div  id ="nav" >< p > nav </ p >< p ></ p ></ div >
     < div  id ="content" > content </ div >
</ div >

正常:

< style > ...
#main {...}{background:red;width:100%}
#nav {...}{background:green;float:right}
#content {...}{background:blue}
</ style >
< div  id ="main" >
     < div  id ="nav" >< p > nav </ p >< p ></ p ></ div >
     < div  id ="content" > content </ div >
</ div >