问使用css在多个div中将图像水平居中

EN

每当用户调整页面大小时，我都会使用css媒体查询来调整一系列div。我可以让所有东西都居中，但它并不一致。所有div都应该有相同的css来居中，但是对于@media (max-width: 560px)媒体查询(最后一个)，我必须这样做：

#game_box .text_holder {
    margin-left: 25px;
}

#kids_devotional_box .text_holder {
    margin-left: 0px;
}

#family_devotional_box .text_holder {
    margin-left: 0px;
}

我的问题是，为什么不是所有的页边距-左边都是一样的？如果我将它们全部设置为0px或25px，一些将关闭，而另一些将居中。我在别的地方做错了什么吗？另外，请随时给我关于我的css的提示，因为我是非常新的。

https://jsfiddle.net/dholl7213/kmkphavj/20/