Как прикрепить виджет соц. сетей к левому краю экрана?

[Марат]

Здравствуйте!

 

На блоге Free-pc.ru решил установить вертикальный плавающий виджет соц. сетей от Share42.ru.

 

 

Вот его код:

 

<div class="share42init" data-url="<?php the_permalink() ?>" data-title="<?php the_title() ?>" data-top1="650" data-top2="650" data-margin="-135"></div>

<script type="text/javascript" src="http://free-pc.ru/share42/share42.js"></script>

 

Но при разных разрешениях экрана он сдвигается влево-вправо.

 

Подскажите пожалуйста как прикрепить виджет соц. сетей "намертво" к левому краю экрана? Как виджет "Отзывы и предложения"

 

Спасибо!

[Марат]

Я так понял или никто не знает или не хочет отвечать...

[Maxsim]

http://htmlbook.ru/css/float

[Марат]

http://htmlbook.ru/css/float

Ну и как "Float" применить к моему коду? В стилях прописать или напрямую задать?

[Maxsim]

Как тебе угодно.!) )) 

[Марат]

Как тебе угодно.!) )) 

А конкретно на моем коде можешь показать?

[Maxsim]

В стиле к классу .share42init{}

[Марат]

В стиле к классу .share42init{}

Я так понял этот класс подгружается со стороннего сервиса. Я могу прописать его у себя в стилях?

[Maxsim]

Да а можешь.! Так <div class="share42init" data-url="<?php the_permalink() ?>" style="float:right;" data-title="<?php the_title() ?>" data-top1="650" data-top2="650" data-margin="-135"></div>

[Марат]

 

Применил как Вы написали, теперь код висит ровно посередине страницы! Пробовал менять data-margin - не реагирует!

Вот посмотрите пожалуйста как у Вас отображается: http://free-pc.ru/utility/kak-razdelit-zhestkij-disk-besplatnoj-programmoj-aomei-partition-assistant-standard-edition-konkurs.html  Плавающий Виджет соц. сетей должен находиться в левом нижнем углу...

[Int]

#share42 {bottom: 0;left: 0;top: auto !important;margin-left: 0 !important;}

Нашёл в коде

</tr></br><placeholder/>

<tr>

Странные вещи

[Марат]

#share42 {bottom: 0;left: 0;top: auto !important;margin-left: 0 !important;}

Нашёл в коде

</tr></br><placeholder/>

<tr>

Странные вещи

 

Спасибо! А из кода тогда убирать: data-top1="650" data-top2="650" data-margin="-135" ?

 

Про странные вещи что Вы имеете ввиду?

[Марат]

Спасибо! Вроде получилось. Единственное на маленьких разрешениях (например с телефона) кнопки немного наезжают на текст, но здесь я не знаю решение проблемы...

[Int]

Решение проблемы — расположение их на маленьких разрешениях среди остального контекста, то есть не плавающим блоком.

Странные вещи я имею в виду, что <br> не имеет закрывающего тэга, тэга <placeholder> тоже не существует, и всё это в любом случае неуместно между </tr> и <tr>. Я думал, это очевидно.

[Марат]

Решение проблемы — расположение их на маленьких разрешениях среди остального контекста, то есть не плавающим блоком.

Странные вещи я имею в виду, что <br> не имеет закрывающего тэга, тэга <placeholder> тоже не существует, и всё это в любом случае неуместно между </tr> и <tr>. Я думал, это очевидно.

Данный код я взял с подписной формы сервиса JastClick

[Марат]

Друзья, а как сделать так, чтобы при одном разрешении экрана выводился этот скрипт, а при другом разрешении - другой скрипт?

 

Например: На мониторах - выводился плавающий вертикальный виджет соц.сетей, на смарфонах - горизонтальный виджет внизу статьи.

 

Как это реализовать?

[Int]

Выводить нужно один, только стили ему разные присвоить через @media. Но можно и яваскриптом полностью менять один на другой, если на то пошло.

Хорошо, код взят с какой-то формы. Но он по-прежнему абсурден. Ничего не изменилось от того, что мы выяснили его происхождение.

[Марат]

Выводить нужно один, только стили ему разные присвоить через @media. Но можно и яваскриптом полностью менять один на другой, если на то пошло.

Хорошо, код взят с какой-то формы. Но он по-прежнему абсурден. Ничего не изменилось от того, что мы выяснили его происхождение.

Скрипт там выводится один:

<div class="share42init"></div>

<script type="text/javascript" src="http://site.name/share42/share42.js"></script>

 

но он запускает другой скрипт share42.js, которых 2 варианта (вертикальное размещение виджета или горизонтальное)

 

Через @media можно решить этот вопрос?

[Int]

Скорее всего можно, потому что это вертикальное и горизонтальное задано стилями, а стили можно менять.

[Марат]

Скорее всего можно, потому что это вертикальное и горизонтальное задано стилями, а стили можно менять.

Так как это реализовать?

[Int]

Универсального решения не могу дать, нужно смотреть структуру этого блока и отталкиваться от него. Одним словом: сверстать.