Question

如何将课程small_icons水平放置在tpt_box的中心？

<div id="tpt_box" style="position: fixed;top:0px;left:2px;background-color: transparent;color:white;
     z-index: 999; width: 100%;">
    <div class="small_icons" style="">
      <span class="count" id="mytimer" >0</span>
      <span class="status" id="status" ></span>
      <span class="refresh" id="refresh" onclick="window.location.reload();" ></span>     
      <span class="chat" id="chat" onclick="chatme();" ></span>      
      <span class="fullscreen" id="myfullscreen" onclick="enterFullScreen();"></span>
      <span class="endcall_btn" id="disconnectcall"></span>
      <!-- Contents -->
      <span class="content_popup" id="content_popup" onclick="content_popup();" ></span>

    </div>         
</div>

Answer 1

可能有很多可能的方法来实现预期的结果，最简单的方法是

将style=" ...; text-align: center;"添加到外部div。将style="display-inline: block;"添加到内部div。

<div id="tpt_box" style="position: fixed;top:0px;left:2px;background-color: transparent; color: white; z-index: 999; width: 100%; text-align: center">
    <div class="small_icons" style="display: inline-block;">

Answer 2

试试这个

    #tpt_box{
     height: 300px;
     position: fixed;top:0px;left:2px;background-color: transparent;color:white;
     z-index: 999; width: 100%;

   }

   .small_icons{

      postion: absolute;
      top: 50%;
      left: 50%;
   }

Css - 我如何将这个内部div放在外部div的中心？

2 个答案: