[Помогите] Плавающий div с соц кнопками!

Тема в разделе "Верстка", создана пользователем k0missar, 13 мар 2013.

Информация :
Уважаемые пользователи, прежде чем ответить в теме или создать новую, внимательно ознакомьтесь с Правилами раздела и Правилами форума
Для быстрого поиска ответов на ваши вопросы воспользуйтесь Картой раздела и/или Поиском по разделу
Модераторы: ultra
  1. k0missar

    k0missar

    Регистр.:
    20 сен 2008
    Сообщения:
    200
    Симпатии:
    25
    Помогите с банальной темой. Нужно расположить блок div с кнопками от соц сетей снизу сайта и что бы он постоянно там плавал.
     
  2. kadurinho

    kadurinho

    Регистр.:
    21 июн 2011
    Сообщения:
    602
    Симпатии:
    242
    Код:
    <div style="position:fixed; right:15px; bottom:0; width:150px; height:20px;">
    тут блок социалок
    </div>
    
    не подойдет?
     
    sprinters нравится это.
  3. k0missar

    k0missar

    Регистр.:
    20 сен 2008
    Сообщения:
    200
    Симпатии:
    25
    Да он то зафиксировался снизу, НО как его оцентровать?
     
  4. kadurinho

    kadurinho

    Регистр.:
    21 июн 2011
    Сообщения:
    602
    Симпатии:
    242
    Код:
    <div style="position:fixed; left:45%; bottom:0; width:150px; height:20px;">
    тут блок социалок
    </div>
    поиграйся со значениями left
     
    k0missar нравится это.
  5. Новый ВебМастер

    Новый ВебМастер Постоялец

    Регистр.:
    26 фев 2013
    Сообщения:
    54
    Симпатии:
    8
    а почему бы для <div> не задать display:block;position:fixed;width:150px;height:20px; margin: 0px auto;

    да-да, всё верно.

    Код:
    <div class="fixed">
    <div class="block"></div>
    </div>
     
    .fixed {position:fixed;width:100%;bottom:0px;}
    .block {width:150px;height:20px;display:block;margin:0px auto}
    
     
  6. Azadi

    Azadi Писатель

    Регистр.:
    17 мар 2013
    Сообщения:
    2
    Симпатии:
    2
    HTML:
    style="position:fixed; left:50%; bottom:0; width:150px; height:20px; margin:0 0 0 -75px;"
    Вот так принято делать в таких случаях.

    Потому что так работать не будет. position:fixed; и position:absolute; изымают блок из контекста форматирования и margin:auto; будет бесполезен. Другое дело что можно внутрь нашего фиксированного блока положить еще один div с указанием ширины и margin:auto;, не забыв при этом растянуть fixed блок на 100% по ширине.
     
    PeRsoNaliTy нравится это.
  7. PeRsoNaliTy

    PeRsoNaliTy Постоялец

    Регистр.:
    5 фев 2009
    Сообщения:
    80
    Симпатии:
    9
    Вот это правильное решение. Дополню только, что -75 это отступ с левой стороны и половина ширины фиксированного блока. Логика такая сдвигаем влево на половину ширины окна, а дальше сдвигаем блок обратно на половину ширины блока и выходит ровно по середине. Так же можно делать и по вертикали.