Okay, now I'm going to move to the main topic - The actual reason of writing this article is that, if your blog template is responsive, but your images are not responsive then don't worry today with the help of this article I'm going to show you how you can easily make your blog images (Pictures) responsive in just few minutes.
How To Make Blog Pictures Responsive?
If your blog images are unresponsive and they are bothering you then follow the below simple steps and you can fix your problem without having any problem.
Before?
In the above demo, the width of the image is greater than the width of the content. (Unresponsive Images)
Fixing the problem?
First open your blogger dashboard - Open
Now go to"Template" section and then click on "Edit Html" button to make some changes.
After that find the below tag (code) by pressing "Ctrl + F" key together from your stylish keyboard.
]]></b:skin>
And then copy the below CSS code and paste it just before ]]></b:skin>
.post-body img {
max-width:100%;
height:auto;
}
Now click on the orange save template button to apply the changes.
Click on the below download button to see the demo after fixing this issue.
After?
In the above demo, the width of the image is same than the width of the content. (Responsive Images)
That's it! I hope you like this tutorial! Stay tuned for more blogger tips and tricks! Thanks for reading @Prince
0 Comment to "How To Make Blog Images Responsive"
Post a Comment