Как использовать дисплей в @media

Question

У меня есть текстовый div, который каким-то образом разделился на две отдельные строки и не выровняется в одну строку.Я пытаюсь использовать display: initial;, который должен поместить все это в одну строку.Он отказывается отвечать на margin-top или margin-bottom и отвечает только на положительный line-height.Есть три возможных варианта.В идеале я хотел бы, чтобы текст был в одной строке, 2-е - наиболее желательное уменьшение высоты строки с отрицательными значениями, 3-е - использование поля для увеличения высоты текста на странице.Попытка с использованием important не отвечает.

Css:

@media (max-width: 5000px) and (min-width: 768px) {.awpcp-listing-excerpt-extra {display: initial; line-height:50%; margin-top:-20px;}} 

HTML

<div class="awpcp-listing-excerpt 
$awpcpdisplayaditems 
$isfeaturedclass" data- 
breakpoints-class-prefix="awpcp- 
listing-excerpt" data- 
breakpoints='{"tiny": [0,328], 
"small": [328,600], "medium": 
[600,999999]}'>
<div class="awpcp-listing-excerpt- 
thumbnail">. 

Страница: рабочий стол: https://adsler.co.uk/browse-adsler/

Текст с желтым фоном)

Answer 1

Тег <br> (разрыв строки) выводится после первого бита содержимого в div awpcp-list-excerpt-extra.Вы должны будете удалить это от того, где контент генерируется.Или вы можете заставить браузер игнорировать тег <br>, например:

.awpcp-listing-excerpt-extra br {
    display: none;
}