position:absolute;在自适应项目中的应用

前段时间做了一个H5的音乐播放控件,其中有一个功能是一个时间进度条在同级右边展示一个时间刷新

如图：

由于要有自适应的功能在给进度条块和时间块分宽度的时候，不管是用%还是em或rem总是不能达到满意效果

后来无意中给进度条块试了下position：absolute;top:0px;bottom:0px;left:0px;right:50px;

而时间块给了固定值并设置了float:right; 效果非常惊喜；这时不管如何变化浏览器大小都能很好的达到想要的效果！

下面是一个固定左右标题和自适应图片的应用:

 
   

   
   
   
   
   
   
   

 
  
 
   

    左标题左标题左标题左标题左标题左标题左标题左标题左标题左标题左标题左标题左标题左标题左标题左标题左标题
   

    右标题右标题右标题右标题右标题右标题右标题右标题右标题右标题右标题右标题右标题右标题右标题右标题右标题
   

 

效果图: