【发布时间】：2019-01-09 11:17:46
【问题描述】：
因此，我将一些 html 放入 SharePoint 上的脚本编辑器 Web 部件中。它在 Chrome SharePoint 上看起来不错，在我的 Explorer 11 上的本地服务器上看起来正确......
但在 Explorer 11 中查看 SharePoint sn-p 时，数字文本会移到每个按钮的右侧。
有谁知道这是 SharePoint/Explorer 问题还是因为 sn-p 在其他任何地方看起来都很好？谢谢
这个 sn-p 是它在我的 Explorer 本地服务器和 Chrome/Chrome Sharepoint 上的样子
.grid {
margin: 0 auto;
width:150vw;
max-width: 150vh;
/*height: 25vw;*/
/*max-height: 25vh;*/
font-size: 2rem;
}
.row1 {
display: flex;
float: center;
margin: 0 auto;
width:50vw;
max-width: 50vh;
/*height: 25vw;*/
/*max-height: 25vh;*/
font-size: 2rem;
}
.row2 {
display: flex;
}
.box {
background: #003b5c;
margin: 5px;
color: white;
font-weight: bold;
flex: 1 0 auto;
position: relative;
}
.box:after {
content: "";
float: left;
display: block;
padding-top: 100%;
}
.box > div {
background-size: cover;
background-position: center;
position: absolute;
left: 0;
right: 0;
bottom: 0;
top: 0;
display: flex;
align-items: center;
justify-content: center;
text-shadow: 0px 0px 8px rgb(36, 36, 36), 0px 0px 20px rgba(0, 0, 0, 0.9);
}
/* Apply images here */
.topblock {
background-image: url("https://media1.tenor.com/images/16ffa7fc3ca750fd6f64eaf577e529c5/tenor.gif?itemid=7422720");
}
.leftblock {
background-image: url("https://media1.tenor.com/images/16ffa7fc3ca750fd6f64eaf577e529c5/tenor.gif?itemid=7422720");
}
.midblock {
background-image: url("https://media1.tenor.com/images/16ffa7fc3ca750fd6f64eaf577e529c5/tenor.gif?itemid=7422720");
}
.rightblock {
background-image: url("https://media1.tenor.com/images/16ffa7fc3ca750fd6f64eaf577e529c5/tenor.gif?itemid=7422720");
}
/* Hover effect*/
.section {
align-items: center;
text-align: center;
box-shadow: 0px 0px 5px 2px #7a9bac79;
transition: box-shadow 0.2s linear;
margin: 0.5em; /* Increased margin since the box-shado expands outside the element, like outline */
}
.section:hover {
box-shadow: 0px 0px 0px 8px #ffc72c;
}<body>
<div class="row1">
<!-- Link and Title -->
<div class="box section" onclick="location.href='https://google.com';" style="cursor:pointer;">
<div class="topblock" href=""><h4 style="color:white;">1</h4></div>
</div>
</div>
<div class="grid">
<div class="row2">
<!-- Link and Title -->
<div class="box section" onclick="location.href='https://google.com';" style="cursor:pointer;">
<div class="leftblock"><h4 style="color:white;">2</h4></div>
</div>
<!-- Link and Title -->
<div class="box section" onclick="location.href='https://google.com';" style="cursor:pointer;">
<div class="midblock"><h4 style="color:white;">3</h4></div>
</div>
<!-- Link and Title -->
<div class="box section" onclick="location.href='https://google.com';" style="cursor:pointer;">
<div class="rightblock"><h4 style="color:white;">4</h4></div>
</div>
</div>
</div>
</body>【问题讨论】：
标签： html css internet-explorer sharepoint