去除浮动的新方法

<div class="timeline-label"><span class="time_axis"><a href="#">2019-04-25 03:17:48</a></span><img class="img_rem" src="/static/imgs/1_03.png"><p class="text-bold"><a href="#" class="text-danger">大决策</a></p>       <div class="text_xw yin_chang">
<span class="red_txt">机会前瞻</span>
           <span class="red_txt"></span>
<span class="hui_txt"></span>
       </div>
       <section class="demos img-holder">
           <div class="demo-image " data-image="" data-title="" data-caption="><img class=" image"="" src=""></div>
<div class="demo-image " data-image="/articleFile/upload/image/thumbnail/e78b6958-3a2c-4dc8-b810-f4e9f8b111561.jpg"><img class="Image" src="/articleFile/upload/image/thumbnail/e78b6958-3a2c-4dc8-b810-f4e9f8b111561.jpg"></div>       </section>
   <div class="vid-txt">元隆雅图002878
   </div>
   <div class="vid-txt">乾景园林603778
   </div>
   <div class="vid-txt">中国国旅601888
   </div>
<span class="time_axis"><a href="https://baijiahao.baidu.com/s?id=1631676885139285924&amp;wfr=spider&amp;for=pc">推荐阅读:<span class="href_color"></span></a></span>   <div class="ti_shi">
      <span>(以上内容仅供参考。市场有风险,投资需谨慎。) </span>
      <span class="y_z">
      <a href="/page/quiz?articleId=3798"><span><i class="fa fa-comment-o" aria-hidden="true"></i> 提问 </span></a>
          <a onclick="sendMessage()"><span><i class="fa fa-mail-forward" aria-hidden="true"></i>分享 </span></a>
      </span>
   </div>
  </div>
一、要求:下面三个元素浮动,不会影响后面的兄弟元素
   <div class="vid-txt">元隆雅图002878
   </div>
   <div class="vid-txt">乾景园林603778
   </div>
   <div class="vid-txt">中国国旅601888
   </div>
这下面的排版,不乱
<span class="time_axis"><a href="https://baijiahao.baidu.com/s?id=1631676885139285924&amp;wfr=spider&amp;for=pc">推荐阅读:<span class="href_color">2019北京世园会展出规模、参展方数量将刷新A1类历史纪录</span></a></span>   <div class="ti_shi">
      <span>(以上内容仅供参考。市场有风险,投资需谨慎。) </span>
      <span class="y_z">
      <a href="/page/quiz?articleId=3798"><span><i class="fa fa-comment-o" aria-hidden="true"></i> 提问 </span></a>
      <a onclick="sendMessage()"><span><i class="fa fa-mail-forward" aria-hidden="true"></i>分享 </span></a>
</span>

更改css
.vid-txt {
font-size: 12px;
color: #4168ae;
margin: 0px 0 15px 0;
float: left;
width: 50%;
}

更改css

.time_axis {
    font-size: 12px;
    color: #888;
    font-family: Microsoft YaHei;
    display: -webkit-inline-box;
}

只在谷歌浏览器上测试的




 
原文地址:https://www.cnblogs.com/liaohongwei/p/10768540.html