Customize the Facebook Like Box with CSS



// Stylesheet//
<style type="text/css">
.facebook-area { background-color:#F4F4F4; width:250px; padding:10px 0 10px 10px; height:250px; border:1px solid #CCCCCC; }
.facebook-inner { height:250px; overflow:hidden; }
</style>

// HTML//
<div class="facebook-area">
<div class="facebook-inner">
<div class="fb-like-box"
data-width="245" data-height="290"
data-href="https://www.facebook.com/nextbits.eu"
data-border-color="#F4F4F4" data-show-faces="true"
data-stream="false" data-header="false"> </div>
</div>
</div>
<div id="fb-root"></div>
<script>(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/en_US/all.js#xfbml=1";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
</script>

facebook-likebox

Advertisements

9 thoughts on “Customize the Facebook Like Box with CSS

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s