Search code examples
javascripthtmlcssfacebook-likesticky-footer

Facebook like button frame inside a fixed footer


I want to get something like this

enter image description here

but I currently have this

enter image description here

I have tried some things to solve it but I am getting nowhere, What can I do?

Here is the fiddle

I have some definitions like:

#footer {
            padding: 20px;
            background-color: #000;
            color: #fff;
            font-size: 12px;
}

and this iframe

<iframe src="FACEBOOKURL&amp;layout=button_count&amp;show_faces=false&amp;width=450&amp;action=like&amp;colorscheme=light&amp;height=20" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:100%; height:20px;" allowTransparency="true">
</iframe>

Solution

  • use float left.

    <div style="float:left">text</div>
    <div style="float:left">iframe</div>
    

    make sure that iframe width can adjust on your space

    check this - http://jsfiddle.net/im4aLL/xjJsk/10/