css - 位置相对被阻止

Question

尝试使用 position:relative 将我的徽标移动到页面的左侧。但是，当我将它移动 20px 时，它不会移动，但是当我将它移动到底部 300px 时，它就会消失。

这是我的代码目前的样子：

.container-header {
    justify-content: flex-end;
    display: flex;
    padding-bottom: 20px;

}
nav{
    flex-wrap: nowrap;
    margin-top: 20px;
}

nav a{
    text-decoration: none;
    box-sizing: border-box;
    align-items: flex-end;
}

a{
    box-sizing: border-box;
    margin-bottom: 40px;
    color: black;
    margin: 20px;
}

img {
    position: relative;
    left: 40px; 
}

关于为什么它不起作用的任何建议？

标签： cssflexbox

Answer 1

使用 "margin-left" 代替 "left" ：

img{
  position: relative;
  margin-left: 40px
}

我建议你在你的 img 周围制作一个“div”，以便更好地控制位置，希望它会有所帮助