Я реализую Facebook Like Button, но у меня проблемы с шириной. Я использую реализацию JavaScript SDK, а не прямой iframe.
В соответствии с документацией ширина по умолчанию 450. Это прекрасно, и я понимаю, что ширина может быть изменена с помощью атрибута width в теге <fb:like>. Однако моя проблема в том, что я действительно не могу указать фиксированную ширину. Из-за характера кнопки ширина не является постоянной во всех состояниях. Например, если кому-то не понравилась страница, она отображает "Будьте первым из ваших друзей, чтобы это понравилось"; если кто-то есть, он отображает "XXX человек, как это. Будьте первым из ваших друзей"; и все же, если вам понравилось, оно отображает "Вам нравится это" или "Вам и XXX людям нравится это". Другими словами, есть много состояний кнопки, ни одна из которых не имеет постоянной ширины.
Это не было бы большой проблемой, если бы не тот факт, что я хочу отобразить кнопку, расположенную в правой части <div>. Чтобы быть более ясными, это то, что я делаю:
<div id="wrapper">
<span class="fb-like"><fb:like show_faces="false" width="450" font="lucida grande""></fb:like></span>
...
</div>
<style type="text/css">
.fblike {
display: inline-block;
padding: 0.5em;
position: absolute;
right: 0;
top: 0;
}
#wrapper {
position: relative;
}
</style>
Это отлично работает, но проблема в том, что iframe теперь имеет постоянную ширину 450 пикселей. Поскольку iframe выровнен по левому краю, когда текст короче, дополнительное пространство справа. Я пробовал различные приложения text-align: right безрезультатно. И эта проблема еще больше усугубляется тем фактом, что это действительно просто причудливая разметка для iframe, добавленная FB SDK, поэтому я не могу изменить какое-либо ее содержимое с помощью CSS или JavaScript.
Мне нужно решение, которое будет либо (a) поддерживать ширину динамической области кнопки (то есть, она изменяется в соответствии с содержимым); или (b) выровнять по правому краю все в области кнопок.
Спасибо за любую помощь, которую любой может мне дать!
