Bố cục full màn hình bị kéo giãn khi thêm 1 bố cục khác?

Tiêu đề hơi khó hiểu ha ! .Ý mình là khi tình chỉnh 1 bố cục full màn hình.(Không post hình được vì mình là “người mới” T_T)

Phần code html:

<body>
	<div id="background"></div>
</body>

Phần code css:

*{
	margin:0px;
	padding:0px;
}

#background
{
	width:1366px;
	height:662px;
	background-image:url(Images/a.jpg);
	background-repeat:no-repeat;

}

(Sẵn tiện chỉ mình cách viết code css trên đây luộn nha ^^)

Nhưng khi mình chèn thêm 1 bố cục nữa thì nó lại bị như thế này:

Phần code html:

	<body>
		<div id="background"></div>
		<div id="div"></div>
	</body>

CSS:

*{
	margin:0px;
	padding:0px;
}

#background
{
	width:1366px;
	height:662px;
	background-image:url(Images/a.jpg);
	background-repeat:no-repeat;

}

#div
{
width:30px;
height:50px;

}

Giải thích giùm mình vì sao nó lại bị như vậy và chỉ cho mình luôn cách khắc phục với!Cảm ơn trước nhé ! ^^

mtoplist