如何在TailwindCSS中保持左右边距自适应且相等？
2026-8-14
问题：TailwindCSS中固定比例的Div无法始终居中且缩放异常
- 最初通过
mx-[40%] mt-[10%]将div固定在屏幕中央，当前屏幕尺寸下可行，但缩放或调整视口后，比例变得异常。 - 尝试用
aspect-[4/3]固定比例，再通过flex布局居中，但无论设置什么aspect值，都无法正确调整div形状，它总是撑满整个屏幕。 - 参考相关方案调整最小宽高（仍不清楚inset属性的作用），但该方法存在两个问题：
- 仅在特定屏幕尺寸下显示正常，无法始终居中；
- 鼠标缩放时，登录div的左边界固定，右边界随空间变化移动扩展，导致div缩放后快速占用右侧和顶部边距，最终显示异常（如图：
）。
- 在非标准分辨率100%缩放时，div仍无法完全居中（如图：
）。
内容的提问来源于stack exchange，提问作者CrabBucket
相关产品推荐
相关产品推荐
