p5.j​​s 画布添加不需要的滚动条

Question

我正在使用来自它的父级的值创建一个简单的 p5.js 画布，如下所示：// Canvas propertiesvar $musicscape = $("#musicscape");// p5.js functionsfunction setup() {    var canvas = createCanvas(        $musicscape.outerWidth(),        $musicscape.outerHeight()) ;    canvas.id("canvas")    canvas.parent($musicscape[0]);}我的musicscape元素具有以下 sass 属性，并具有正确的大小，而无需创建任何滚动条。#musicscape    position: absolute    right: 0    top: 0    width: 50vw    height: 100vh但是，当我添加与我的html、body和#musicscape元素大小完全相同的画布时，会添加一个垂直滚动条。删除它的唯一方法是设置画布宽度$musicscape.outerHeight() - 3，同时在底部创建一条不属于画布的小白线。如何在将画布保持为其父级大小的同时摆脱垂直滚动条？我检查过，页面上的任何地方都没有填充或边距。顺便说一句，我正在 Chrome 上进行测试。

Answer 1

HTML canvas 元素默认是内联元素（内联元素列表）。因此，即使您将它的高度设置为与它的父级完全相同，它也会因行间距而溢出。为防止将画布设置为 SASS 文件中的块级元素。

#canvas
    display: block;