CODEWITHSUNDEEP
css
user460114
user460114

Reputation: 1848

CSS - Facebook buttons dropping down after liking

We have this annoying layout issue. Please see the following url to see it in action:

http://www.businesseventsydney.com.au/home-page-test.cfm

The FB like buttons are neatly situated in the top nav bar. But, as soon as you click "Like" and enter a comment, the buttons drop down below the nav bar. If you refresh the page, the buttons appear correctly again.

Can anyone shed any light on this?

Upvotes: 0

Views: 66

Answers (4)

Mateusz Rogulski
Mateusz Rogulski

Reputation: 7445

Just change your #top-nav-right css rule to:

#top-nav-right {
  float: right;
  overflow: hidden;
  padding: 4px 125px 0 0;
  width: 129px;
}

Upvotes: 0

Rohit Azad Malik
Rohit Azad Malik

Reputation: 32182

Hi now define height of your iframe css as like this 

.fb_iframe_widget iframe{
height:244px !important;
border-bottom:solid 1px #000;
}


!important must give to this

Result is this

enter image description here

Upvotes: 1

zenkaty
zenkaty

Reputation: 1548

Simple fix:

.fb-like {width: 128px !important;}

Upvotes: 1

sq2
sq2

Reputation: 595

The element changes from having a width of 129px before liking etc, to having a width of 450px after liking.

So, you will have to make it fit into your design in a spot that allows for the worst case scenario, ie, 450px.

Upvotes: 0

Related Questions