Skip to main content

Indie game storeFree gamesFun gamesHorror games
Game developmentAssetsComics
SalesBundles
Jobs
TagsGame Engines

Unity WebGL - How to remove border + fit on mobile screens?

A topic by Quite Good created Oct 05, 2021 Views: 1,814 Replies: 1
Viewing posts 1 to 2
(1 edit)

I just published my game today, and something I noticed is that it has a border around it that I would like to get rid of (the light purple border in the image below)

This is made in Unity with a resolution of 960 x 540 built using WebGL. On itch.io I set the resolution to 980 x 560 because at 960 x 540 there is still a border, just on the top and right sides of the game window. I've seen other HTML games that don't have this issue and I am not sure how to fix it.

My second issue is that on mobile, the game window is way too big so most of it is cut off:

Is there a way to make the game rotate to fit on the screen/be fullscreen on mobile so that all of it is visible?

(2 edits) (+2)

Hello!

I recently encountered a similar issue similar to your first. The game I am currently working on I wanted to have specifically blend into the webpage background. You can see the end result here.

As for how I completed this, I found the incredibly useful (Unity) Better Minimal WebGL Template by Sean. Following the steps listed on this page to download & install the package into your Unity build will prove very accessible. The only thing I will state is aware that you also must be aware of your itch.io  Embed Options when uploading your build to itch.io itself. You should no longer have to account for any border as you have done, but rather just input the actual desired game size.

I currently don't have any insight for your second issue, but hope that you are able to figure it out soon.

I hope that this was helpful!