内联块元素上的CSS text-align

luc*_*uca 7 html css text-align

我有这个结构:

<div class="father">
 This string is left-aligned
 <div class="divToCenter" style="display:inline-block;">
  //contains other divs.I used inline block for making this div as large as 
  //content ATTENTION: its width is not fixed! 
 </div>

</div>
Run Code Online (Sandbox Code Playgroud)

怎么说呢

让我只有名为"divToCenter"的类以"father"div为中心.

谢谢

卢卡

cla*_*uzy 3

#left {
  float: left;
   background: #eee;
   width: 200px; /* width is optional */
}
#content {
  overflow: hidden;
  text-align: center;
}
Run Code Online (Sandbox Code Playgroud)
    <div class="father">
     <div id="left">This string is left-aligned</div>
     <div id="content">
      <!-- contains other divs.I used inline block for making this div as large as content -->
     </div>
    </div>
Run Code Online (Sandbox Code Playgroud)

将左对齐的字符串或块向左浮动,然后在overflow:hidden内容上它将自动占用剩余空间,您可以text-align按照自己的意愿进行操作。

或者将左侧内容也转换为内联块,这样它和内容并排放置,您就可以分别使用text-align它们inline-block