Есть ли возможность изменить положение контента внутри моего заголовка? - PullRequest
Новая
       15

Есть ли возможность изменить положение контента внутри моего заголовка?

0 голосов
/ 28 января 2019

Я сейчас играю с Angular и Clarity Design.Теперь у меня есть базовый макет, но у меня есть один вопрос.

Есть ли возможность изменить положение содержимого внутри области моего заголовка?

https://imgur.com/a/KelTWxK

Вот как это выглядит прямо сейчас. 

.title {
    margin-left: 30px;
}
.header-1 {
    padding-bottom: 80px;
}
<link rel="shortcut icon" type="image/x-icon" href="/assets/img/...">

<header class="header-1">
    <div class="branding">
        <a routerLink="/home" class="nav-link">
            <img src = "/assets/img/..." style = "width:70px;height:100px">
            <span class="title">...</span>
        </a>
    </div>
    <div class="header-nav" [clr-nav-level]="1">
        <a routerLink="/verwaltung" class="nav-link nav-icon">
            <clr-icon shape="administrator" size ="36"></clr-icon>
        </a>
        <a routerLink="/downloads" class="nav-link nav-icon">
            <clr-icon shape="download" size ="36"></clr-icon>
        </a>
        <a routerLink="/entwicklung" class="nav-link nav-icon">
            <clr-icon shape="terminal" size ="36"></clr-icon>
        </a>
        <a routerLink="/crm" class="nav-link nav-icon">
            <clr-icon shape="cloud" size ="36"></clr-icon>
        </a>
    </div>
    <form class="search">
        <label for="search_input">
            <input id="search_input" size ="64" type="text" placeholder="Suche nach Begriffen...">
        </label>
    </form>
    <div class="header-actions">
        <clr-dropdown>
            <button class="nav-icon" clrDropdownTrigger>
                <clr-icon shape="user"></clr-icon>
                <clr-icon shape="caret down"></clr-icon>
            </button>
            <clr-dropdown-menu *clrIfOpen clrPosition="bottom-right">
                <a routerLink="/kontakt" clrDropdownItem>Kontakt</a>
                <a routerLink="/ausloggen" clrDropdownItem>Ausloggen</a>
            </clr-dropdown-menu>
        </clr-dropdown>
    </div>
</header>

Я бы хотел переместить кнопки и панель поиска вниз, чтобы она выглядела как расположенная по центру внутри заголовка.

Я надеваюне хочу изменять высоту заголовка, хотя

1 Ответ

0 голосов
/ 06 февраля 2019

Вы уже изменяете размер заголовка по умолчанию с помощью дополнительного отступа, поэтому вам придется применить заполнение ко всем элементам, чтобы сделать их центрированными, или задать большую высоту строки, чтобы выровнять высоту.Есть много способов сделать это с помощью CSS, но вы сами по себе, так как переопределяете стили Clarity.

...