Javascript 使用填充将组件向左移动

我正在

草图组件中使用p5.js的视频组件。然而，我无法设计它的风格

我想将其向右移动一点，但它卡在屏幕的最左边。我为Sketch的css添加了paddingLeft，但这没有什么区别

类似地，我希望将组件放置在屏幕顶部。但是，它从屏幕中间开始。添加左边的填充完全没有区别。我相信草图或画布组件有自己的背景/填充，我看不到

export const Component: React.FC<ComponentProps> = (props: ComponentProps) => {

    let capture: p5Types.Element;
    const setup = (p5: p5Types, canvasParentRef: Element) => {
        p5.createCanvas(390, 240);
        capture = p5.createCapture(p5.VIDEO);
        capture.size(320, 240);
      }
      
      const draw = (p5: p5Types) => {
      }

      
    return <Sketch setup={setup} draw={draw} className="sketch"/>
    ;
};


export const Component:React.FC=（props:ComponentProps）=>{
让我们捕获：p5Types.Element；
常量设置=（p5:p5Types，canvasParentRef:Element）=>{
p5.createCanvas（390240）；
capture=p5.createCapture（p5.VIDEO）；
捕获。大小（320240）；
}
常量绘制=（p5:p5类型）=>{
}
返回
;
};

如何将视频组件移向屏幕右侧和/或顶部

代码沙盒：
看起来你不需要画布


发生的是一块空画布压下了你的视频