Fixed sizes
Fixed sizes
破坏布局的常见情况之一是， 具有固定宽度或固定高度的容器，填充了长度不一的内容， 当内容过长时，就会发生 内容溢出的情况，导致 布局被破坏。
固定高度
一种常见的情况是， 一个卡片容器的高度是固定的，但是 它的内容 却大于 容器的高度， 导致了布局被破坏。
.card {
height: 100px;
} 一个卡片容器的高度是固定的，但是 它的内容 却大于 容器的高度， 导致了布局被破坏。 一个卡片容器的高度是固定的，但是 它的内容 却大于 容器的高度， 导致了布局被破坏。
为了避免内容从 卡片 中溢出，我们需要使用 min-height 而不是 height 。
.card {
min-height: 100px;
} 一个卡片容器的高度是固定的，但是 它的内容 却大于 容器的高度， 导致了布局被破坏。 一个卡片容器的高度是固定的，但是 它的内容 却大于 容器的高度， 导致了布局被破坏。
这样就可以避免内容从 卡片 中溢出。
固定宽度
另一种常见的情况是，一个标签的内容太靠近左右边缘，发生溢出。 这是由于使用了 固定宽度。
.tag {
width: 100%;
}标签内容
标签内容比较长
要解决这个问题，我们可以使用 min-width 替代 width
.tag {
min-width: 100px;
}标签内容
标签内容比较长
