Question

我正试图集中iframe，但似乎无效。

HTML code：

<ul class ="xslides" id=xslide1">
  <li><iframe width="750px" height="500px" frameborder="0" src="test/embed" marginwidth="0" marginheight="0" scrolling="no" style="border: none; max-width:100%; max-height:100vh" allowfullscreen webkitallowfullscreen  mozallowfullscreen msallowfullscreen></iframe>
  </li>
</ul>

CSS：

.xslides ul li {
  -webkit-backface-visibility: hidden;
   width: 100%;
   margin-left: auto;
  margin-right: auto;

  }

Answer 1

如果我没记错，列表项是内联元素。

.xslides ul li {
   -webkit-backface-visibility: hidden;
   width: 100%;
   display: block;

 }
 iframe {
   outline: 1px solid black;
   display: block;
   margin: 0 auto;
   width: 750px;
   height: 500px;
 }

你可能想试试这个，

https://jsfiddle.net/fpc9g3mx/

顺便说一下，您可能还想从list-style删除.xslides。

如何在列表项中居中iframe

1 个答案: