gpt4 book ai didi

html - 为什么 flexbox 居中在 I.E 11 中不起作用?

转载 作者:太空宇宙 更新时间:2023-11-04 10:38:33 25 4
gpt4 key购买 nike

我有以下简单动画 HERE :

现在我的问题是关于我在 body 元素上的 flexbox 居中代码,即 I.E.

HTML:

 <body class="loading-doc">
<div class="loader">Loading...</div>
</body>

CSS:

.loading-doc  {
position: fixed;
height: 100vh;
width: 100vw;
background: #fff !important;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-align:center;
-webkit-align-items:center;
-ms-flex-align:center;
align-items:center;
-webkit-box-pack:center;
-webkit-justify-content:center;
-ms-flex-pack:center;
justify-content:center;
overflow: hidden;
}

上面的代码在所有浏览器中都以 body 的(唯一)子元素为中心,IE 除外,有人可以解释为什么吗?

我已经在 I.E 中测试过。 9、10、11(即使我在 Windows 8.1 上,它在浏览器工具中显示为边缘)和 flexbox 不起作用,我希望至少 ie 11 可以工作,但它不起作用,为什么?

caniuse.com LISTS ie 11 部分支持 flexbox,我使用的属性是基本的 flexbox 属性,所以为什么它们在 ie 11 中不起作用(在我的 ie 控制台中也意外地显示为边缘)。有人可以向我解释一下吗?

编辑::

我附上了我在下面看到的内容的屏幕截图。

enter image description here

看向中间的右边。

最佳答案

老实说,您提供的代码没有问题。它适用于所有版本的 IE、Safari、Chrome、Firefox 等。我相信问题出在您自己的 IE 版本中。尝试将 IE 重置为默认设置(先备份以确保您不会丢失任何内容)。

https://support.microsoft.com/en-us/kb/923737

Manually open the Reset Internet Explorer Settings dialog box

a.Close all Internet Explorer and Explorer windows that are currently open. b.Start Internet Explorer.

Note If you are running Windows 8.1 or Windows 8, start Internet Explorer from the desktop. Changing your settings will affect both Internet Explorer and Internet Explorer that you start from the desktop. c.On the Tools menu, tap or click Internet options. If you don't see the Tools menu, press Alt. d.In the Internet Options window, tap or click the Advanced tab. e.Tap or click Reset. If you're using Windows Internet Explorer 6, click Restore Default.

2.In the Reset Internet Explorer Settings dialog box, tap or click Reset.

Note Select the Delete personal settings check box if you also want to remove browsing history, search providers, Accelerators, home pages, Tracking Protection, and ActiveX Filtering data. 3.When Internet Explorer finishes applying the default settings, tap or click Close, and then tap or click OK. 4.Exit and then start Internet Explorer.

这在我身上发生过一次,当时我的 IE 显示的内容与其他人不一样。幸运的是,我只使用 IE 进行测试,因此重置不会破坏我的任何东西。然而,重置工作完美并解决了我的问题。让我知道它是否解决了您的问题。

关于html - 为什么 flexbox 居中在 I.E 11 中不起作用?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/35993812/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com