Question

I successfully added the Facebook Like button to each my blog’s posts.

The problem: posts whose titles are longer than one line cover the Like button. (See my blog here. Scroll half way down to posts with the problem, please.)

Here’s what I know:

(1)the “headline_area” div includes the title and the author name. The content body of each posts is always directly beneath that div.

(2) When the title of a post is only one line, the Facebook Like button stays up again the bottom of the title. Because the “headline_area” div is consistent, the body of the post stays below both the title, author, and facebook like buttons.

(3) When the title is two lines, the “headline_area” div remains the same, but the Like button gets pushed down by the second line. The post content stays up against the headline_area div, thus overlapping the Like button.

I hope that is clear. Any help is much appreciated!

Answer 1

The problem is with CSS .headline_area style. It has defined fixed height to height: 80px (custom.css:7). Try removing it and changing facebook like iframe height.