只有当我在 nav li{}
中添加 display: inline-block
时,flex-direction:row
才有效。我知道它是因为 -webkit-flex-direction: row-reverse;
正在工作。但是 justify-content: space-between;
等其他属性不起作用。
相反;如果我在 nav li{}
中删除 display: inline-block
,则只有 flex-direction:column
可以工作。有什么问题?
nav{
background: grey;
display:-webkit-flex;
-webkit-flex-direction: row;
}
nav li{
list-style: none;
}
<nav>
<ul>
<li><a href="#about">About</a><li>
<li><a href="#skills">Skills</a></li>
<li><a href="#education">Education</a></li>
<li><a href="#experience">Experience</a></li>
<li><a href="#portfolio">Portfolio</a></li>
</ul>
</nav>
最佳答案
它只会给你一种它有效的错觉。
Flex 设置在 <nav>
水平使得<ul>
flex 元素,不影响 <li>
元素。
您希望 Flex 容器为 <ul>
.
关于html - 为什么 flex-direction : row only work when I set the element to display: inline-block?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/27150196/