Width and Height not working correctly

General
1

I am trying to have 4 rectangles contacting the middle of each of the screens edges. However, they are not appearing in the middle. Does anyone know why?

-- Blocker
displayMode(FULLSCREEN)
-- Use this function to perform your initial setup
function setup()
    print("Hello World!")
end

-- This function gets called once every frame
function draw()
    -- This sets a dark background color 
    background(69, 207, 235, 255)

    -- This sets the line thickness
    strokeWidth(5)

    -- Do your drawing here
    fill(255,255,255)
    rect(WIDTH/2,HEIGHT-20,WIDTH/4,20)
    rect(WIDTH/2,0,WIDTH/4,20)
    rect(0,HEIGHT/2,20,HEIGHT/4)
    rect(WIDTH-20,HEIGHT/2,20,HEIGHT/4)
    
end
2

Rect takes the bottom left corner and width and height as the inputs. You are starting to draw the rectangles from the mid point of the screen rather than shifting it by half the width or height of the rectangle.

Here is a solution with this subtraction stated explicitly

-- Blocker
displayMode(FULLSCREEN)
-- Use this function to perform your initial setup
function setup()
    print("Hello World!")
end

-- This function gets called once every frame
function draw()
    -- This sets a dark background color 
    background(69, 207, 235, 255)

    -- This sets the line thickness
    strokeWidth(5)

    -- Do your drawing here
    fill(255,255,255)
    rect(WIDTH/2-WIDTH/8,HEIGHT-20,WIDTH/4,20)
    rect(WIDTH/2-WIDTH/8,0,WIDTH/4,20)
    rect(0,HEIGHT/2-HEIGHT/8,20,HEIGHT/4)
    rect(WIDTH-20,HEIGHT/2-HEIGHT/8,20,HEIGHT/4)

end
3

Before drawing all your rectangles, place rectMode(CENTER) if you want to use centered coordinates for them

4

Yep, I just realized that. What a silly mistake, however I am probably not he only one to do this so at least it will help people in the future.