How To Place Images Side By Side In Blogger?

Adding images in Blogger is easy, but formatting them can sometimes get tricky. One of these tricky formats is placing two images side by side. To achieve this, you need to go to the HTML view and write some code. So I’ve written a step by step guide on how you can place images right next to each other.

Step 1: Switch the view from “Compose” to “HTML”

Step 2: Copy and paste the HTML template below into your “HTML view”

<!--Side By Side Image Template STARTS Here-->

<div>

<!--To remove the border you can change the value to 0 or simple erase it-->

<!--Adjust the spacing by changing the values of cellpadding & cellspacing-->

<!--For smaller images you can remove style="width: 100%;"-->

<!--Input additional <td> </td> for 3 or more images-->

<table border="1px" cellpadding="0px" cellspacing="5px" style="width: 100%;">

    <tbody>

        <tr>

            <td>

                (Your Image Here)

            </td>

            <td>

                (Your Image Here)

            </td>

        </tr>

    </tbody>

</table>

</div>

<!--Side By Side Image Template ENDS Here-->

Step 3: Put the cursor in the middle of an empty “<td>” and  “</td>” of the template

Step 4: Click on “Insert image“ and upload one image

Step 5 (Optional): Change the image “width” to 100%

Step 6: Repeat steps 3 to 5 for the other empty “<td> </td>”

Step 7: Switch back to “Compose view” to see the result

-End

Recommended Post

How To Fix Mobile Links Not Opening In Blogger?

Social Media & Contact