Procedure to Center an Image
Step 1: First, download an image from any web browser on your laptop or PC.
Step 2: After downloading the image, create a html file using a Visual Studio Code or any text editor.
Step 3: Then, move the image to the location where you created the html file.
Step 4: Now, insert the image to the html file using the <img> tag with src="image-name.extension(jpg,png, or svg)".
Step 5: Next, create a <style> tag in the Head section and add the following styles to the<body> tag,
- margin: 0;
- display: flex;
- width: 100%;
- height: 100vh;
Step 6: After that, add the property margin as auto to img tag in style section.
Step 7: Finally, run the html file to see the output.
Output Screenshot
