Javed
KPCKevin Powell - Community
•Created by Javed on 12/14/2023 in #front-end
Find Dimensions of frontendmentor design without pro
When tackling a Frontend Mentor challenge without a pro membership, figuring out the height, width, margins, and border-radius can be challenging. Often, you have to rely on your eyes and make educated guesses. However, here's a handy trick: open the design preview image in your browser, enter inspect mode, and add a simple HTML element to the body. Set its style to
position: absolute and adjust height, width, top, left, or inset to easily determine the dimensions of any component in the design.
In the video, I demonstrate how playing with these properties allows you to accurately find the dimensions of various elements. Additionally, if you need to pinpoint the exact color, use the browser's built-in color picker in inspect mode.
Remember, as a coder, you have the power to overcome challenges and achieve precise results. Watch the video to see this trick in action and enhance your Frontend Mentor experience!12 replies