Black div (bug)

I have a black div on my right side, it appeared after I tweak a few settings in the render resolution.
The project is private, but I can provide all information you need in order to help me with the bug

This is how div looks like

Hi @Dava,

Is it a div or just the background body of the page?

If you have changed your Fill Mode (in rendering settings) to Keep aspect ratio it’s normal for the game to not fill the whole of your window.

image

Normally you will decorate/change the color of the remaining space to match your game, using CSS.

Hi @Leonidas , thanks for the reply

I don’t know is it a div, but definitely is not the empty space in world space, here is an image of the scene

I tried every Fill mode , every time that black element stays the same, everything I do, it doesn’t go away

That’s strange, never encountered this. Are you using any HTML for your UI?

Is it possible to share a link to a build to check what this div may be?

I don’t have any HTML/CSS script in the project, or UI element on Canvas as well.
The problem is, our project is private, I am not allowed to share anything since this is work for another company , is it possible for me to share some info, take a screen or anything that could help you with the problem ?

Yes, what will help is if you right click on that div and select Inspect Element. That will trigger open the browser dev tools with the HTML DOM hierarchy.

Try sharing a screen grab of that to see what this element may be.

When I do that, it highlights this code

<canvas id="application-canvas" tabindex="0" class="fill-mode-NONE" width="1536" height="864" style="margin-top: 173px;"></canvas>

Hmm, that’s not a div, that’s the Playcanvas canvas element, where the app is drawn.

Are you sure this black space isn’t part of the Playcanvas scene rendered?

Could you replicate this issue in a new project without the private assets?

Just tested a few things, something is really not right

The primitive object that I added in the scene, outside of the camera view is displayed in play mode
Another thing, 2DCanvas is short, as you can see in the picture I added a button in the end, and in-play mode there is just right that black div

Unfortunate I can’t share anything of the project since it’s not mine, sorry guys

You should be able to use the same camera and project settings with some placeholder/free textures to replicate the same view and setup in a new project though?

If that’s not possible, it’s a bit tricky as we have to try and replicate it in another project.

I sent you private msg with the link of project

Change the camera viewport from [0, 0, 0.9, 1] to [0, 0, 1, 1]

image

Currently, you are only rendering 90% of the width of the canvas.

2 Likes

You are right, thank you so much @yaustar and @Leonidas :slight_smile: