倾斜 div 没有正确转换？

Question

我有一个使用 transform: skewY(-10deg); 创建的倾斜 div 但我不能将它放在页面顶部，并使用 top:% 指令。

它没有响应式地工作。

如何让它工作？

top:0 和 left:0:

顶部：-135px：

Answer 1

请提供 jsfiddle 或您要实现的目标的图像 - 目前尚不清楚您想要什么。

但是，要居中放置 div：

div {
  position: fixed;
  top: 0;
  left: 50%;
  transform:translateX(-50%);
}

Answer 2

尝试将元素 triangle-div 的 css 更改为以下内容。

#triangle-div{
    width: 0;
    height: 0;
    border-top: 100px solid red;
    border-right: 200px solid transparent;
    position: fixed
}