Css float 而不移动其他 float

Question

我想将 5 张图片并排放置；在悬停其中任何一个时，我希望悬停在图像上的宽度增加而不会将其旁边的图像推离它。我希望一切都留在原地，但要让悬停在上方的图片变大。我该怎么做。

Answer 1

Live demo

你好，现在已经习惯了这个没有 float 的 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>

Live demo

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

---

Updated demo