вопрос
Такая ситуация: решил на сайт прикрутить виджет "Мы на одноклассниках". И все бы ничего, но встает он коряво и не могу сообразить, как его выправить.
Код получен с одноклассников и все, что можно сделать - настроить привязку к группе и выставить ширину и высоту. У меня правая колонка 200 пикселей и виджеты от контакта и фэйсбука я делал 180пикс, обрамлял рамкой и все получалось хорошо. Тут же, как оказалось, мин ширина виджета 200пикс, а если выставить меньше (180), то теряется рамка и съедаются буквы. Выглядит так:
Рамка прописана в styles.css.
Подскажите, как поправить ситуацию:
1. Каким-то образом дорисовать правую линию (убавив размер до 180)
или
2. Вписать виджет ровно в рамку (выставить по центру). Все мои манипуляции с центрированием не увенчались успехом:(. Отступ слева не пойму откуда берется.
Код:
Код получен с одноклассников и все, что можно сделать - настроить привязку к группе и выставить ширину и высоту. У меня правая колонка 200 пикселей и виджеты от контакта и фэйсбука я делал 180пикс, обрамлял рамкой и все получалось хорошо. Тут же, как оказалось, мин ширина виджета 200пикс, а если выставить меньше (180), то теряется рамка и съедаются буквы. Выглядит так:
Рамка прописана в styles.css.
Подскажите, как поправить ситуацию:
1. Каким-то образом дорисовать правую линию (убавив размер до 180)
или
2. Вписать виджет ровно в рамку (выставить по центру). Все мои манипуляции с центрированием не увенчались успехом:(. Отступ слева не пойму откуда берется.
Код:
<div id="ok_group_widget"></div>
<script>
!function(d,id,did,st){
var js=d.createElement('script');
js.src="http://connect.ok.ru/connect.js";
js.onload = js.onreadystatechange = function (){
if(!this.readyState || this.readyState=="loaded" || this.readyState=="complete"){
if(!this.executed){
this.executed = true;
setTimeout(function(){OK.CONNECT.insertGroupWidget(id,did,st);},0);
}
}
}
d.documentElement.appendChild(js);
}
(document, "ok_group_widget", 52809255288912, '{width: "198",height: "250"}');
</script>
Уменьшить виджет - никак. Заполнить ним блок - без проблем. Самый простой способ:
1. Родителю присваивается position:relative;
2. Виджет оборачивается div'ом с position:absolute;
Код примерно таков:
1. Родителю присваивается position:relative;
2. Виджет оборачивается div'ом с position:absolute;
Код примерно таков:
<div class="parent">
<div class="widget">
// widget code
</div>
</div>
.parent {
position:relative;
}
.widget {
position:absolute;
top:10px;
left:0;
}