Css 如何将图像置于div的中心而不是文本

我正在尝试将我的div中的一个图像集中在两个带有样式表的类上。我的代码中缺少了什么

.wrapper-data {
position:relative;
width:100%;
border: none;
margin: 40px 0 0 0;
overflow: hidden;

苹果居中，文本不居中，但梨居中，文本也居中。我希望梨子居中，但Nearth下面的文本不能居中

.wrapper-data {
position:relative;
width:100%;
border: none;
margin: 40px 0 0 0;
overflow: hidden;

本以为这样就可以了，但不起作用：

    .data_cell1_text, .data_cell3_text img {
    display:block; 
    margin:0 auto;
    }

.wrapper-data {
position:relative;
width:100%;
border: none;
margin: 40px 0 0 0;
overflow: hidden;

.wrapper-data {
position:relative;
width:100%;
border: none;
margin: 40px 0 0 0;
overflow: hidden;

}

.wrapper-data {
position:relative;
width:100%;
border: none;
margin: 40px 0 0 0;
overflow: hidden;

---

将图像包装在div中：

.wrapper-data {
position:relative;
width:100%;
border: none;
margin: 40px 0 0 0;
overflow: hidden;

<div class="theimg">
<img src="https://pbs.twimg.com/profile_images/3588564988/ca2ec46372bf01eff59044dd0046132c.jpeg" width="50" height="50">
</div>

这里有一个JsFiddle来更好地表示我给您的想法

.wrapper-data {
position:relative;
width:100%;
border: none;
margin: 40px 0 0 0;
overflow: hidden;

---

将您的css更正为

.wrapper-data {
position:relative;
width:100%;
border: none;
margin: 40px 0 0 0;
overflow: hidden;

.data_cell1_text img, .data_cell3_text img {
        display:block; 
        margin:0 auto;
}

---

我不明白这个问题-你的小提琴按照你的描述工作。再看看我的小提琴。苹果是我想要的，下面的文字不居中。梨的图像和文本都居中，这是我不想要的。