我相信对于了解 CSS 语言的人来说,这是一个非常基本的问题(不是我的情况,哈哈)。我正在使用 this code托管在 jsfiddle 以在我的网站上制作一些语音气球。当气球内的消息很少时,问题就来了。例如,在上面发布的代码中,将代码从“bubble you”气球更改为:
<div class="bubble you">Hi.</div>
你会看到气球与之前的气球保持在同一水平线上,这很丑陋也很奇怪。我希望气球一个接一个地(一个在另一个下面)保持不变,即使消息很小,就像一个简单的“嗨”...我应该更改或添加气球类中的哪些属性来实现这一点?
最佳答案
将 clear: both
添加到 .bubble
。
演示在这里:
http://jsfiddle.net/sifriday/mek5Z/1957/
.bubble{
background-color: #F2F2F2;
border-radius: 5px;
box-shadow: 0 0 6px #B2B2B2;
display: inline-block;
padding: 10px 18px;
position: relative;
vertical-align: top;
clear: both
}
关于html - CSS 语音气球宽度,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/28027444/