html - 顶部和左侧不需要的空白

Question

我正在尝试在左上角的标题下制作图像，但图像不想覆盖左侧。

我将位置更改为位置：绝对，将边距和填充设置为 0，检查了 HTML 页面，看不到任何可能影响此图像的内容。

的HTML：

        <div class="header">
            <div class="container">
                <div class="row">
                    <div class="col">
                        <h1>Dillan Robbertze<h1>
                        <img src="mountain-og.jpeg">
                    </div>

                </div>
            </div>
        </div>

CSS：

.header img{
    height:Auto;
    left:0;
    margin:0;
    padding:0;
    position:absolute;
    width:100vw;
    z-index:1;
    }

预期结果：图像位于左上角的标题下方。实际结果：图像左侧和顶部有一个空白区域。

编辑：我添加了 top:0; 感谢@Somesh Mukherjee。图像向上移动，但仍有一个不应该存在的剩余空间。

标签： htmlcss

Answer 1

您尚未指定 top 属性

.header img{
    height:auto;
    left:0;
    top:0;
    margin:0:
    padding:0;
    position:absolute;
    width:100vw;
}