CSS - Top to Logo = 0px

Question

Я работаю в течение нескольких часов прямо сейчас на изменениях CSS на одном из сайтов моего клиента. Мой клиент хочет, чтобы заголовок (логотип) отображался в верхней части экрана без пробела между верхом и логотипом.

<header id="header"> 
 
    <div class="avada-row" style="padding-top:30px;padding-bottom:0px; overflow:hidden;"> 
 
    <div class="logo" data-margin-right="0px" data-margin-left="0px" data-margin-top="3px" data-margin-bottom="3px" style="margin-right:0px;margin-top:3px;margin-left:0px;margin-bottom:3px;"> 
 
     <a href="#"> 
 
     <img src="http://placehold.it/1000x100" alt="Heider Matriken – Falk Fengler" class="normal_logo"> 
 
     </a> 
 
    </div> 
 
    </div> 
 
</header>

Я не нахожу правильные настройки .css, чтобы решить эту проблему и переместить изображение заголовка в верхней части. Я уже пробовал:

margin-top: -30px; 

... но это не работает. Это сайт Wordpress, я использую Avada, и единственное, что мне нужно, это изображение заголовка вверху.

Было бы здорово, если кто-то может мне помочь.

Answer 1

Проблема заключается в том, что ваш сгенерированный код содержит padding-top:30px в:

<div class="avada-row" style="padding-top:30px;padding-bottom:0px; overflow:hidden;"> 

I что вы не можете изменить это, и простой CSS не поможет вам, потому что встроенный стиль более важен.

Используйте this trick переопределить встроенный стиль, используя внешний CSS:

.avada-row { 
    padding-top:0px !important; 
} 

Answer 2

тха класс ".avada-строка" является верхней мягкой, так что вам нужно удалить, что отступы:

.avada-row { padding-top: 0px !important; } 

Answer 3

либо использовать этот HTML

<header id="header"> 
    <div style="padding-bottom:0px; overflow:hidden;" class="avada-row"> 
    <div style="margin-right:0px;margin-left:0px;margin-bottom:3px;" class="logo" data-margin-right="0px" data-margin-left="0px" data-margin-bottom="3px"> 
     <a href="#"> 
     <img src="http://placehold.it/1000x100" alt="Heider Matriken – Falk Fengler" class="normal_logo"> 
     </a> 
    </div> 
    </div> 
</header> 

или использовать этот CSS

.avada-row { 
    padding-top: 0px !important; 
} 
.avada-row .logo { 
    margin: 0px !important; 
}