我无法在css中设置填充或边距

发布于10月20日

我正在制作一个投资组合网站，我收到了一个错误，

我不能为我的文本设置填充顶端或边框顶端在这里，它看起来像:

#skill {
  overflow: hidden;
  width: 100vw;
  max-width: 65rem;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  margin: 0 auto;
  padding-top: 3rem;
}

.skillTitle {
  font-size: 3rem;
  font-weight: 600;
  margin-bottom: 1.5rem;
  padding-top: 3rem;
  /* Add padding-top here */
}

.skillDescription {
  padding-top: 1rem;
  margin-top: 1rem;
  margin-top: 3rem;
  color: darkgrey;
  font-weight: 100;
  font-size: 1rem;
  font-style: italic;
  max-width: 50rem;
  padding: 0 2rem;
}

<section id="skill">
  <span class="skillTitle">What I do</span> <br />
  <span class="skillDescription">I am a passionate web developer and UI/UX designer, dedicated to creating intuitive,
    user-friendly interfaces and seamless web experiences. My expertise lies in crafting visually
    appealing websites with a focus on functionality and accessibility.</span
  >
  <div class="skillBars"></div>
</section>

我想知道为什么会发生这种情况，以及我如何纠正他的这个错误！

.skillDescription { padding-top: 1rem; <- this gets override by last line ------ margin-top: 1rem; <- this gets override by next line | margin-top: 3rem; | color: darkgrey; | font-weight: 100; | font-size: 1rem; | font-style: italic; | max-width: 50rem; | padding: 0 2rem; < --------------------------------------- }

我无法在css中设置填充或边距

推荐答案

Css相关问答推荐

通过使溢出的子元素具有其宽度的100%来防止Flex元素溢出

容器内的中心固定元件

此css Select 器的总体特性是什么？按钮：不是(#mainBtn，.cta)

我的css是我的react 应用程序没有按预期工作

在AND设计令牌上使用不同的主题

为什么在RadixUi上应用Tailwincss和自定义css类不起作用？

如何将CSS动画从第一列移动到第二列？

CSS Select 器仅 Select 具有特定类名称的每行的第一个单元格

解释 "document.styleSheets[0].cssRules[0].style;"

是否有一个 CSS 可以根据字符的高度 for each 字符呈现可变高度？

CSS 仅过渡背景 colored颜色

如何在 Tailwind 中使用 `margin： y x;` 速记？

使用 node-sass 在压缩文件末尾添加 min.css 文件扩展名

在 CSS 中相对于另一个元素定位一个元素

如何通过单击
激活 HTML 链接？

如何制作一个div来包装两个浮动div？

使用 Twitter Bootstrap 使页脚粘在页面底部

CSS设置宽度以填充剩余区域的百分比

修复 Mobile Safari (iPhone) 上文本呈现不一致且某些字体比其他字体大的字体大小问题？

为什么容器 div 坚持比 IMG 或 SVG 内容略大？