Hello, I am new to programming and this is my first attempt at a game. I'm using just pure Javascript, html, and css. I was trying to format it to fit on my Galaxy note 8 so the canvas is kinda wonky on different screens. I also cant find a way to get my 2 buttons I use as controllers to fill up on the bottom line. Other than that I'm not sure where to go next with my program, constructive criticism would be very much appreciated. Ill post the HTML file with my game(sorry I'm so inefficient in my code). Thank you for reading my post.
First Game Attempt -- very noob, need help
I'm assuming the buttons are separate HTML elements. This is totally up to you, but you might instead consider using only a single HTML element - the canvas - and implementing all game elements, including UI elements such as buttons, within the canvas using your own code. This would be more similar to what you'd typically do in third-party game engines or frameworks, and would mean not having to deal with HTML layout issues and so on.
Also, your canvas fills the entire screen horizontally on a wide desktop monitor, but it looks like maybe the game is intended to be 'narrower' than that (based on the yellow and red boxes at the top). I'm wondering if maybe you want the canvas only to be as wide as the line of yellow/red boxes. If so, keep in mind that the canvas doesn't have to fill the entire screen. Although it might take a little work, there are ways you could have it dynamically fill the entire screen on, say, a mobile device, but only fill part of the screen (and be centered) on e.g. a wide desktop monitor.
[Edit: Edited for clarity.]