【问题标题】:Website left aligned on iPad in Safari and Chrome网站在 Safari 和 Chrome 中的 iPad 上左对齐
【发布时间】:2013-08-16 21:21:32
【问题描述】:

我在 iPad 上遇到中心对齐问题。 它在 iPad Safari 和 iPad Chrome 浏览器中无法正常工作 - 我尝试了我在网络上找到的所有建议 - 但我没有找到解决方案。

我的网站是newgranatik.tw1.ru,这个中间(主)块有问题。

【问题讨论】:

  • 当你用text-align强制它时会发生什么?
  • 我尝试添加 text-align:center;到 body 或 #main-container - 但没有运气(
  • text-align:center !important 呢?
  • 我应该将它应用到哪个容器?
  • 应用到#main-container。我已经在运行 webkit(相同的渲染引擎)的 chrome 版本上对其进行了测试。

标签: ipad safari center-align


【解决方案1】:

我已详细查看了您的网站。问题是,当您减小浏览器的宽度(或在较低分辨率的设备上查看)时,#main-container{margin: 0 auto} BUT #header 为中心保持静态,宽度为 1200 像素,因此它们两者都无法对齐!

通过减小浏览器窗口(在桌面上)的宽度来重现 iPad 的渲染方式。

我建议让您的标题自动调整大小和自动居中。您可以从使用 css 减小低分辨率/移动屏幕的徽标大小开始。

否则,该网站的设计不错。

【讨论】:

  • 非常感谢!我会考虑如何减少网站宽度。
【解决方案2】:

我找到了有趣的解决方案 - 将元标记添加到我的网站

<meta name="viewport" content="width=[widest centered div];"/>

【讨论】:

    猜你喜欢
    • 2022-06-10
    • 2023-03-08
    • 1970-01-01
    • 2022-11-02
    • 1970-01-01
    • 2011-05-07
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多