CODEWITHSUNDEEP
htmlcssfacebookfacebook-likefacebook-likebox
Philip Brocoum
Philip Brocoum

Reputation: 2906

Facebook like button offset beneath div even though there's no margin or padding

As you can see from the example below, the Facebook like button is supposed to appear in that blank space between the date and the start of the article, but instead it's shifted downwards for an unknown reason that I can't figure out. I'm sure it's some obscure weird CSS stuff, but any help is appreciated. Thanks! :-)

And here's the actual page: http://readabout.me/achievements/Reinhardt-University-s-Morgan-Sparks-Selected-for-Who-s-Who-Among-Students-in-American-Universities-and-Colleges/3638644

Exapmple

Upvotes: 0

Views: 1458

Answers (5)

Philip Brocoum
Philip Brocoum

Reputation: 2906

This worked. Thanks everyone!

-#news-story iframe.fb_ltr {margin:25px 0 10px 0;}
+
+div#fbLikeButton {
+    margin-top: 10px;
+    margin-bottom: 10px;
+}

Basically, I removed the internal styling and styled the surrounding div. I didn't realize we had code that actually styled inside the Facebook like button iFrame.

Upvotes: 0

Philip
Philip

Reputation: 5021

Just add a height property in the like button - #fbLikeButton{height:60px;}

Upvotes: 0

ShibinRagh
ShibinRagh

Reputation: 6646

I fount the issue

Please remove margin #news-story iframe.fb_ltr

http://readabout.me/stylesheets/news.css line 30 - and set padding top on "#fbLikeButton" problem will be solve

I could fixed the issue on firebugg , this is print screen;

Upvotes: 2

KBN
KBN

Reputation: 2974

I think this will solve your problem :)

<div id="fbLikeButton" style="height: 50px; ">

Edit: I think the @cpilko has spotted the exact reason, though I believe the news.css is not yours but facebook's, in that case you can try adding the following code to your css.

#news-story iframe.fb_ltr {
 margin: 0 !important;
}

Upvotes: 1

cpilko
cpilko

Reputation: 11852

Delete line 30 in your news.css file:

#news-story iframe.fb_ltr {margin:25px 0 10px 0;}

You are explicitly giving the like button iframe a top margin of 25px.

Upvotes: 2

Related Questions