为何盒子会变扁？
<title>填充</title>
<style type="text/css">
#box1{
width:100px;
height:100px;
padding:10px 20px;
border:1px solid red;
}
</style>
</head>
<body>
<div id="box1">盒子1爱的发卡机独守空房吉萨的几份</div>
</body>
如果以上代码，盒子都是100px，正常应该是个正方形啊，为何这些代码运行后盒子变成了一个矩形呢？
我的理解应该是盒子还是正方形，里面的文字分成更多行显示，以保证左右各是20px
现在的结果有点不理解，求教，谢谢！
