Как избавиться от места и выровнять два объекта в одну строку в css / html?

Question

Я пытался использовать firebug для поиска проблемы, но не могу найти решение по следующему адресу:

1. Как избавиться от пробела между изображением и текстом? Например, разрыв между изображением сумок, похожих на лего, и текстом «AboveHere Concept»

2. Как выровнять эти две социальные кнопки в одной строке? Я установил ширину класса twitternews в 90px, а в фрейме facebooknews - в 90px, но это не работает. У меня также есть эти две кнопки в блоке с шириной, равной 200 пикселей, но, похоже, это тоже не работает.

Answer 1

1) Добавьте стиль margin-top: 0px к тегу P, в котором находится текст «AboveHere Concept». Также удалите знак <br> прямо перед текстом. Все будет двигаться вверх.

2) facebooknews добавляет width: 100px;, и оно будет соответствовать.

Answer 2

твой

<p> 

теги в элементах div после тела имеют верхнее и нижнее поле 1em. вот почему там много места. убери их

.post-body p {
  margin: 0;
}

вам нужно установить div .facebooknews, чтобы иметь меньшую ширину, а не фрейм

div.grid-item .facebooknews {
  clear: none;
  float: left;
  padding-right: 5px;
  width: 100px;
}