facebook комментарий плагин высота

Я использую плагин Facebook comments на моей странице, но проблема в том, почему он занимает всю высоту браузера. Я разместил изображение, которое должно появиться под полем комментария, но изображение находится внизу страницы, так как поле комментариев занимает весь браузер.facebook комментарий плагин высота

Как ограничить высоту тата?

Это код, который я использую.

<html> 
    <head> 
     <title>Facebook Plugin Sample - Facebook Comments </title> 
     <meta name="viewport" id="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no"> 
    </head> 
    <body> 
     <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> 
     <div class="fb-comments" data-href="http://example.com" data-mobile="true"></div> 
     <img src="http://cdn3.1stwebdesigner.com/wp-content/uploads/2009/02/toolbox-icon.jpg" style="border:1px #000 solid;" alt="" /> 
    </body> 
</html>

И это, как он показывает в настоящее время

enter image description here

DEMO

источник

2013-05-09 Sowmya

Есть ли у вас какие-либо стили на странице, кроме границы на изображении?

Посмотрите на это с помощью своего инструмента разработки для своего браузера, например Firebug для Firefox, и посмотрите, как выглядит плагин и изображение.

Вы можете попробовать обертывание плагина в DIV и стилизации высоты этого DIV:

<head> 
    <style> 
    #comments_wrapper { 
     height: 200px; 
    } 
    </style> 
</head> 
<body> 
    <div id="comments_wrapper"> 
    <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> 
    <div class="fb-comments" data-href="http://example.com" data-mobile="true"></div> 
    </div> 
</body>

Вашей скрипка не отображалась amything. Я разветвил его и, похоже, работал, хотя у меня нет комментариев. Вот ссылка на скрипку:
http://jsfiddle.net/CodeWaggle/JHzjG/

Другой подход заключается в добавлении этого стиля:

#fb_comments { height:400px; padding-bottom:20px; overflow-y: scroll; }

Я нашел его в этом ответе: Limit size of HTML5 Facebook comment box

enter image description here

источник

2013-05-09 09:28:51 codewaggle

Я.И. дал границу одному классу. Даже решение по высоте не работает. Проверьте здесь http://jsfiddle.net/K3CBU/ – Sowmya

Я разветвил вашу скрипку, см. Мой обновленный ответ. – codewaggle

Я забыл его сохранить, теперь он обновлен кодом, который я добавил. – codewaggle

facebook комментарий плагин высота

ответ

Смежные вопросы