# Specifying height and width of your base canvas element
Let's take a look at a bug you can run across, by not specifying height and width of your HTML Canvas element. We will look at giving the canvas height/width inline and in the JS.
## Code Example
- https://plnkr.co/edit/GlXzyZmsTWVu4tvQHTR4?p=preview
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="style.css" />
</head>
<body>
<h1>Specifying height and width of your base canvas element</h1>
<canvas id="canvas"></canvas>
<script src="script.js"></script>
</body>
</html>
const canvas = document.querySelector('#canvas');
canvas.width = canvas.height = 500;
const context = canvas.getContext('2d');
context.fillRect(0, 0, 50, 50);
canvas {
width: 500px;
height: 500px;
}