Css 绝对定位div下的定位

我有4个div包含图像，绝对位置总计100%宽度

这是因为用户希望在所有浏览器中使用页面的全部宽度

我需要在它下面放置一个div，同样具有100%的宽度，它以与浏览器相同的速率展开/收缩

我知道浮动不是一种选择

所需布局：

[img1][img2][img3][img4]
[       content        ]
-------100% width-------

HTML

---

用于此方法

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

Css

#pic-container{
font-size:0;
}
#pic-container img{
width:25%;
  vertical-align:top;
}

HTML

   <div class="container">
     <div id="pic-container">
 <img src="images/1.jpg">
<img src="images/2.jpg">
<img src="images/3.jpg">
<img src="images/4.jpg">
      </div>
     </div>
     <div class="container">
                herer is the your content         
     </div>

这是你的内容

---

如果我没有弄错，请查看您的CSS代码：

您忘了在#image2的结尾处加上“}”。
现在一定是这样

希望能有帮助

---

为什么绝对是必要的？为什么浮动不是一个选项？据我所知，浮动不起作用，因为绝对定位的元素被从工作流中移除。如果有一种方法可以允许100%的宽度和浮动图像的大小将是伟大的：）哇。我把它弄得太复杂了！正在本地安装上测试字体大小：0对图像有什么作用？谢谢。你能推荐一些关于“高级”定位的学习材料吗？欢迎访问并查看此链接，现在了解有关该职位的更多信息。你是否在线寻求一份快速工作？

#pic-container{
font-size:0;
}
#pic-container img{
width:25%;
  vertical-align:top;
}

   <div class="container">
     <div id="pic-container">
 <img src="images/1.jpg">
<img src="images/2.jpg">
<img src="images/3.jpg">
<img src="images/4.jpg">
      </div>
     </div>
     <div class="container">
                herer is the your content         
     </div>

#image2 {
  width: 25%;
  position: absolute;
  right: 75%;
 }