How to Make Facebook Like Box Responsive

Hello friends today in the internet more trending on Blogger templates is more responsive templates. Since i have updraded my blog to a responsive layout, i was try to make my Facebook like box as responsive too. And i was successful i doing it. Today i am going to share my knowledge in doing it responsive for you. If you are using responsive layout for your blog or website, you should make the Facebook like box responsive. This will make your blog more beautiful on mobile devices. So here in this article I am going to show you how to make your Facebook like box responsive.

This is how responsive Facebook like box looks. Once you have added like box code to your blog it looks like this. See the live Demo in our right sidebar.
 

How to Make the Facebook Like Box Responsive

Here I am giving you the step by step guide to make your Facebook like box responsive. Follow my instructions carefully.

• See Some Tips To Stay Secure From Hackers.

How to Add HTML and CSS to Facebook Like Box Code

• Login to your Blogger Dashboard.
• Go to Layout –> Add a Gadget –> HTML/Javascript.
• Copy this HTML and CSS code  and paste it.

<style> .facebook { overflow: hidden; border: 1px solid #d5d5d5; } </style>
<div class="facebook"><iframe src="//www.facebook.com/plugins/likebox.php?href=href=http%3A%2F%2Fwww.facebook.com%2Fmybloggingtechniques&amp;width=700&amp;
height=185&amp;colorscheme=light&amp;show_faces=true&amp;border_color=%23ffffff&amp;stream=false&amp;header=false" style="overflow:hidden; width:700px; height:185px;"></iframe></div>

• Replace mybloggingtechniques with your Facebook fan page username.
• Then don’t forget to Save.

This is a quick and more effective trick to make your Facebook like box responsive. Hope you like this tutorial to make the Facebook like box responsive. Follow the above steps, and if you face any problem regarding this, ask me via comment box below. Please do not spam.