Nice Kloe Ответов: 1

Добавление знака плюс в правом верхнем углу блока div


Всем привет

Я страдал с блоком div, к которому я хочу добавить знак плюс. Я хотел бы добавить знак плюс в правом верхнем углу блока. Но я не знаю, как это сделать.
Вот ссылка на результаты, которых я пытаюсь достичь : Shot.PNG - Google Диск[^]

Заранее спасибо за вашу любезную помощь!

Что я уже пробовал:

Ниже приведено то, что у меня уже есть :
<div style="height :70px; margin-left: 360px; margin-right: 360px; border: 2px solid #0d8aea; border-radius : 20px 0px 20px 20px;">
        <h1 style="text-align: center; font-weight : 700;">A La Une</h1>
    </div>

1 Ответов

Рейтинг:
8

phil.o

Вы можете попробовать добавить a span элемент, который будет выровнен по верхнему правому краю:

<div style="height:70px; margin-left:360px; margin-right:360px; border:2px solid #0d8aea; border-radius:20px 0px 20px 20px;">
   <span style="float:right; text-align:top;">+</span>
   <h1 style="text-align:center; font-weight:700;">A La Une</h1>
</div>

jsfiddle этого блока[^] (Мне пришлось добавить width в стиле, чтобы это работало).


Nice Kloe

Спасибо за это решение. Это правда, что это может функционировать, возможно, с немного большим стилем; я хотел бы, чтобы знак плюс был смелее и больше, чем он есть на самом деле, и лежал точно по краям границы блока div

MadMyche

Настройка CSS

phil.o

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

Nice Kloe

Конечно. Еще раз спасибо

phil.o

Добро пожаловать :)
Пожалуйста, любезно отметьте свой вопрос как ответ, если вы чувствуете, что на ваш вопрос был дан правильный ответ.