CSS对齐不起作用

我有此代码：

<!DOCTYPE html>
<!--Website made by William Stinson, 2016, Unsolicitedly.-->
<html>
<head>
  <style>
    .center {
      text-align: center;
    }
  </style>
</head>
<body>
  <div class="center">
    <a href="http://www.gifford.org">
      <img src="http://www.myhopesanddreams.com/william/giffordlogo.png" draggable="false" alt="logo" />
    </a>
    <br>
    <img src="myhopesanddreams.com/Untitled 3.png" height="100" draggable="false">
    <iframe src="https://docs.google.com/a/gifford.org/forms/d/e/1FAIpQLSeAojv3USFoCWLpHJeIoSEiOydke0dKV3wmS-EWrr4-qbxryw/viewform?embedded=true" width="1300" height="1000" frameborder="3" marginheight="0" marginwidth="0">Loading...</iframe>
    <h1>Created for The Gifford School by William Stinson</h1>
  </div>
</body>
</html>

它正确地居于台式设备，但是在移动设备上，它的核心无法正常。我怎样才能解决这个问题？谢谢您的宝贵时间。

修改您的iframe宽度

.center {
  text-align: center;
}

<div class="center">
  <a href="http://www.gifford.org">
    <img src="http://www.myhopesanddreams.com/william/giffordlogo.png" draggable="false" alt="logo" />
  </a>
  <br><img src="myhopesanddreams.com/Untitled 3.png" height="100" draggable="false">
  <iframe src="https://docs.google.com/a/gifford.org/forms/d/e/1FAIpQLSeAojv3USFoCWLpHJeIoSEiOydke0dKV3wmS-EWrr4-qbxryw/viewform?embedded=true" width="98%" height="1000px" frameborder="3" marginheight="0" marginwidth="0">Loading...</iframe>
  <h1>Created for The Gifford School by William Stinson</h1>
</div>

这是一个演示

相关内容

最新更新

热门标签：