It’s best to use images with the exact size for the given container. This ensures we do not force our users to download unnecessary data, and keeps the site as light as possible.
Here is a quick guide on how to check the size of already uploaded picture, but it will also work for containers (non-image elements)
Chrome:
- Right click the element and select “Inspect”
- A console with the source code of your site will open.
Selected element is highlighted. Please hover your cursor over it.
- Hovered element gets highlighted on the screen with its measurements
This is it! In this example, the size of my picture is 620px x 620px.
Please note this is not as easy nowadays, since in the era of responsive web design the image size may be different depending on the device you are using.
Author: Wojciech Borowicz
I hope this post will help you to do what you need.
In case you want some assistance click here to get in touch