![Як встановити соціальні кнопки в один ряд (один) Як встановити соціальні кнопки в один ряд](https://images-on-off.com/images/142/kakustanovitsotsialnieknopkivodinryad-6ebe86bb.png)
Методом проб і помилок все стало так, як я хотіла. Такий ось маленький, але успіх :) Тепер ближче до справи.
Чому я вирішила зробити кнопки в один ряд. Тому що коли вони знаходяться один під одним, то це не красиво і такий вид псує всю сторінку. Я сама по натурі людина акуратний, і хочу того ж на своєму блозі.
Як я сказала, що я повний нуль у всіх цих кодах і тегах, хоч вони мене і цікавлять в якійсь мірі. Оскільки ця думка не давала мені спокою, вирішила я почитати в інтернеті інструкції по установці ...
![Як встановити соціальні кнопки в один ряд (кнопки) Як встановити соціальні кнопки в один ряд](https://images-on-off.com/images/142/kakustanovitsotsialnieknopkivodinryad-5b8d43cf.png)
Ні в якому разі не хочу образити тих людей, які писали свої інструкції, може бути у них все вийшло, але не у мене. Не дивлячись на мої прямі руки, всі спроби домогтися розташування кнопок в один ряд увінчалися провалом. Аж надто мудрі були інструкції. І до пори до часу я на цю справу навіть забила.
Одним прекрасним вечором на мене зійшло осяяння, оскільки я блогер, то елементарні знання HTML і CSS у мене повинні бути. Все виявилося простіше простого :)
Установка кнопок в один ряд
![Як встановити соціальні кнопки в один ряд (кнопки) Як встановити соціальні кнопки в один ряд](https://images-on-off.com/images/142/kakustanovitsotsialnieknopkivodinryad-6a417284.png)
У мене на блозі знаходяться 4 кнопки, це Вконтакте, Твіттер, Гугл плюс і Фейсбук.
Крок 2. Тепер кожен код візьмемо в контейнер таким чином:
Замість vk_like, twi, g_pl, face - можна дати свої назви. Головне що б вам самим було зрозуміло. Ось так виглядає у мене загальна картина:
![Як встановити соціальні кнопки в один ряд (соціальні кнопки один ряд) Як встановити соціальні кнопки в один ряд](https://images-on-off.com/images/142/kakustanovitsotsialnieknopkivodinryad-a9957183.png)
Крок 3. Тепер переходимо до Списку стилів (style.css)
У самому низу розміщуємо ось такий код:
#vk_like float: left;
padding-left: 30px;
>
Значення float: left - визначає по якій стороні буде йти вирівнювання, в даному випадку по лівій. А всі наступні елементи будуть обтікати його з правого боку.
Значення padding-left: 30px - це відстань від краю до першої кнопки, ви його можете прибрати, якщо не потрібно, просто видаливши цей рядок.
Ще статті по темі:
- Плагін для Wordpress Twitter Anywhere Plus
- Як правильно купувати посилання для просування
- Як збільшити відвідуваність сайту - способи, доступні кожному
- Як оформити текстовий контент
- Інструкція по вибору ключових слів