如果你想使用display：inline方法实现class="wrap"的div居中的话，先在class="wrap"的divd的父元素标签写上text-align:center;使用行内元素居中，然后再把class="wrap"的div设置成display：inline,变成行内元素；原本div是块状元素

如：

<markdown>

<style>

body{text-align:center;}    

.wrap{display:inline;}

</style>

<div class="wrap">    设置我所在的div容器水平居中

</div>

</markdown

先居中，再变行内元素。例题可以看看，居中在外围，变行内元素在里面。

也可以用table把这个div包住,然后设置这个table

<table>

  <tbody>

    <tr><td>

<ul>

    <div class="wrap">

        设置我所在的div容器水平居中

        设置我所在的div容器水平居中  

</div> 

    </ul>

    </td></tr>

  </tbody>

</table>

把你的代码简略下，你想问的是下面的代码为什么不能居中吧。

<style>
    div{display:inline;}
    .wrap{text-align:center;}
</style>
<div class="wrap">
    设置我所在的div容器水平居中
</div>

如果是的话问题很简单，因为你吧div变为行内元素了，想要实现居中有2种办法：

1：将div{display:inline;}去掉，这样就能居中。

2：在div的父元素中写入居中代码，在你的代码里面是在body中写入，这样也能实现居中。

行内元素的宽度就是它包含的文字或图片的宽度，不可改变。所以文本的宽度等于它的父元素div的宽度。