XF 2.2 Баннер

[Castiel772]

Как сделать форму баннера как на скрине?

У Вас недостаточно прав для просмотра ссылок. Вход или Регистрация

Я пробовал здесь брать,

У Вас недостаточно прав для просмотра ссылок. Вход или Регистрация

Только края все ровно кривые получались, не ровные, помогите,дайте нормальный css.

 

[LordGusli]

Так?

Срез сверху слева/снизу слева

border-radius: 120px 0px / 100px;

Срез сверху справа/снизу справа

border-radius: 0px 120px / 100px;

Можно в принципе каждый край баннера отредактировать под нужный градус

border-radius: 60px 10px 60px 10px;

Пытался что-то похожее сделать:

.userBanner.userBanner--admin {
    border: none;
    min-height: 30px;
    font-weight: 700;
    font-size: 9px;
    min-width: 180px;
    border-radius: 15px 5px 15px 5px;
    background: linear-gradient(to bottom, #0001da, #000161);
}

 

[Castiel772]

Так?
Посмотреть вложение 152980Посмотреть вложение 152979
Срез сверху слева/снизу слева

border-radius: 120px 0px / 100px;

Срез сверху справа/снизу справа

border-radius: 0px 120px / 100px;

Можно в принципе каждый край баннера отредактировать под нужный градус

border-radius: 60px 10px 60px 10px;

Пытался что-то похожее сделать:

.userBanner.userBanner--admin {
    border: none;
    min-height: 30px;
    font-weight: 700;
    font-size: 9px;
    min-width: 180px;
    border-radius: 15px 5px 15px 5px;
    background: linear-gradient(to bottom, #0001da, #000161);
}

Посмотреть вложение 152982

Спсибо

 

[Castiel772]

Так?
Посмотреть вложение 152980Посмотреть вложение 152979
Срез сверху слева/снизу слева

border-radius: 120px 0px / 100px;

Срез сверху справа/снизу справа

border-radius: 0px 120px / 100px;

Можно в принципе каждый край баннера отредактировать под нужный градус

border-radius: 60px 10px 60px 10px;

Пытался что-то похожее сделать:

.userBanner.userBanner--admin {
    border: none;
    min-height: 30px;
    font-weight: 700;
    font-size: 9px;
    min-width: 180px;
    border-radius: 15px 5px 15px 5px;
    background: linear-gradient(to bottom, #0001da, #000161);
}

Посмотреть вложение 152982

А как текст сделать ниже и выше?

У Вас недостаточно прав для просмотра ссылок. Вход или Регистрация

 

[LordGusli]

А как текст сделать ниже и выше?

У Вас недостаточно прав для просмотра ссылок. Вход или Регистрация

Применить для всех баннеров:

align-items: center;

Либо

line-height: 30px;

Где 30 px - минимальная высота баннера