高度自動撐開是CSS中常用的一種布局方式。當一個元素內部包含的內容超過了它的高度時，不需要通過手動設置高度或者overflow屬性來保證內容不溢出，而是通過設置內部元素的屬性，使其自動撐開元素的高度。

.container{
display: flex;
flex-wrap: wrap;
align-items: stretch;
}
.container .item{
flex-basis: 200px;
margin: 10px;
background-color: #f2f2f2;
}

以上代碼中，使用了flex布局方式，讓.container元素內部的.item元素自動撐開高度。其中flex-basis屬性表示元素在主軸上的初始大小，而align-items屬性則是設置元素在交叉軸上的對齊方式。

還有一種實現高度自動撐開的方法是使用overflow屬性，將其設置為hidden，然后在內部元素中使用clearfix技巧清除浮動，從而撐開父元素的高度。

.container{
overflow: hidden;
}
.container .item{
float: left;
}
.clearfix::after{
content: "";
display: block;
clear: both;
}

以上代碼中，首先將容器元素的overflow屬性設置為hidden，然后在內部元素中使用clearfix技巧清除浮動。這樣，內部元素的高度自動撐開，就不會出現內容溢出的情況了。