css - CSS浮动而不移动其他浮动

Question

我想将 5 张图片并排放置；在其中任何一个悬停时，我希望悬停在图像上的图像宽度增加，而不会将其旁边的图像推离它。我希望一切都保持原位，但图片被悬停在上面以增大尺寸。我该怎么做。

Answer 1

现场演示

嗨，现在习惯了这个没有浮动的 CSS

CSS

.parent{
border:solid 1px red;
  width:100px;
  white-space:nowrap;
  font-size:0;
}
.parent img{
border:solid 1px black;
  vertical-align:top;
}

HTML

<div class="parent">
<img src="http://www.gravatar.com/avatar/8193632933d351ea68ec1eae12f82057?s=32&d=identicon&r=PG">
<img src="http://www.gravatar.com/avatar/8193632933d351ea68ec1eae12f82057?s=32&d=identicon&r=PG">
  <img src="http://www.gravatar.com/avatar/8193632933d351ea68ec1eae12f82057?s=32&d=identicon&r=PG">
    <img src="http://www.gravatar.com/avatar/8193632933d351ea68ec1eae12f82057?s=32&d=identicon&r=PG">
      <img src="http://www.gravatar.com/avatar/8193632933d351ea68ec1eae12f82057?s=32&d=identicon&r=PG">
</div>

现场演示

---------------

---

更新的演示