小编F. *_*val的帖子

Z-index不适用于flex元素?

我正在尝试有两列,一个是可以扩展并与另一列重叠的菜单.但是我使用了一个flex元素来包装这些列,我的菜单扩展到了另一个元素后面,即使有更大的元素z-index.

渲染是这样的:

.main {
  font-family: 'Open Sans', Helvetica, sans-serif;
  display: flex;
  background-color: #99baef;
}

nav {
  height: 100%;
  width: 8em;
  background-color: black;
  z-index: 1;
}

.navbox {
  box-sizing: border-box;
  background-color: black;
  color: white;
  height: 4em;
  width: 100%;
  text-align: center;
  line-height: 4em;
  border-top: 1px dotted #99baef;
  transition: all 1s;
}

.navbox:hover {
  width: 130%;
  border-top: none;
  background-color: #4a77c4;
  color: black;
}

.container {
  padding: 1em;
}

a {text-decoration: inherit;}
Run Code Online (Sandbox Code Playgroud)
<div class="main">
  <div class="maincolumn">
    <nav>
      <a href="">
        <div …
Run Code Online (Sandbox Code Playgroud)

css z-index overlap css3 flexbox

9
推荐指数
2
解决办法
1万
查看次数

使用 Netlify 部署时出现“Uncaught SyntaxError: Unexpected token &lt;”

我正在开发一个 React 应用程序,使用 Netlify 在提交时自动构建和部署应用程序。问题是,每当在生产中部署新版本时,客户端都会面临一个带有以下错误的空白页面:

\n\n

歌剧:\n在此输入图像描述\n火狐浏览器:\n在此输入图像描述

\n\n

当导航器首次加载网站时,不会发生这种情况,只有在新构建后才会发生。重新加载几次后,问题就消失了,网站运行正常。因此我认为这与缓存有关。

\n\n

另外,我没有\xe2\x80\x99t 设法在本地重现该错误。这仅在 Netlify 部署后发生。

\n\n

索引.html:

\n\n

\r\n
\r\n
<!DOCTYPE html>\r\n<html lang="en">\r\n<head>\r\n    <meta charset="utf-8">\r\n    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">\r\n    <meta name="theme-color" content="#000000">\r\n    <link rel="manifest" href="%PUBLIC_URL%/manifest.json">\r\n    <link rel="shortcut icon" href="%PUBLIC_URL%/favicon.ico">\r\n    <script type="text/javascript" src="https://unpkg.com/babel-standalone@6/babel.min.js"></script>\r\n    <title>Sensuba</title>\r\n</head>\r\n<body>\r\n    <noscript>\r\n    You need to enable JavaScript to run this app.\r\n    </noscript>\r\n    <div id="root"></div>\r\n\r\n    </body>\r\n</html>
Run Code Online (Sandbox Code Playgroud)\r\n
\r\n
\r\n

\n\n

清单.json:

\n\n
{\n"short_name": "Sensuba",\n"name": "Sensuba",\n"icons": [\n{\n  "src": "favicon.ico",\n  "sizes": "64x64 32x32 24x24 16x16",\n  "type": "image/x-icon"\n}\n],\n"start_url": "./index.html",\n"display": "standalone",\n"theme_color": "#000000",\n"background_color": …
Run Code Online (Sandbox Code Playgroud)

caching build netlify

6
推荐指数
0
解决办法
984
查看次数

标签 统计

build ×1

caching ×1

css ×1

css3 ×1

flexbox ×1

netlify ×1

overlap ×1

z-index ×1