Investigate and adjust the alignment of the buttons within the new grid

[rmccar]

Buttons currently dont sit correctly on the grid, the dimensions are not whole pixels. We need to investigate the button css to get the size of buttons to sit on the grid like other components.

As a user,
I want the buttons to sit correctly on the grid,
so that their dimensions are in whole pixels, providing a clean and organized layout.

Acceptance Criteria:

1. Investigate the current dimensions of the buttons.
2. Identify any discrepancies or misalignments with the grid.
3. Investigate the button CSS to determine how to adjust the size of buttons to sit on the grid like other components.
4. Adjust the dimensions of the buttons to ensure they are in whole pixels and sit correctly on the grid.
5. Verify that the changes are consistent across different screen sizes and devices.
6. Ensure that the visual appearance of the buttons is improved and aligns with the overall design guidelines.

Visualisation

Link to the issue on Figma: https://www.figma.com/design/Wr9b6pK35euFoA6xq3G9Ld/Grid-review?node-id=0-1&node-type=canvas&m=dev