html - 使用CSS在多个div中水平居中图像

Question

每当用户调整页面大小时，我都会使用 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;
}

我的问题是，为什么不所有的 margin-left 都是一样的？如果我将它们全部设置为 0px 或 25px，一些将关闭而一些将居中。我在其他地方做错了什么吗？另外，请随时给我关于我的 CSS 的提示，因为我对它很陌生。

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

Answer 1

使用边距和填充以及所有可能对您有帮助的百分比例如:

margin-right: 20%;