时间戳

首页 > 解决方案 > 删除空白 CSS 网格

html - 删除空白 CSS 网格

问题描述

我正在使用 CSS 网格来布局我的网站。我有我想要的粘性侧栏使用的一般效果

.page {
      display: grid;
      grid-template-columns: 250px auto;
        grid-column-gap: 3%;
    }
    .sidebar {
      position: fixed;
      width: 250px;
        height: 100vh;
      background: red;
    }
    .main {
      grid-column-start: 2;
      background: pink;
    }

使用标记如下

<body>
    <div class="page">
    <div class="sidebar">
      <p>sidebar</p>
    </div>

      <div class="main">
      </div>
    </div>

我知道我可以通过使用来摆脱列间隙，grid-column-gap=0但由于某种原因我无法摆脱页面 div 外部的边距？我尝试过使用margin=0，margin-left=0但如果没有空白，我无法将侧栏一直移到左侧。css 网格是否需要不同的东西或者我有什么误解？谢谢！ 截屏

标签： htmlcsscss-grid

解决方案

推荐阅读