#html #css
#HTML #css
Вопрос:
Пытаюсь заставить элемент span отображаться в центре моего изображения, чтобы создать интерактивную кнопку. Класс Span — это элемент «plus_own», отображаемый в левом углу изображения.
.plus_own {
font-size: 70px;
color: white;
font-family: unc;
position: relative;
font-weight: bold;
top: -30px;
transition: all 0.4s ease;
}
Элемент класса Centered span пытается создать интерактивную кнопку.
Ответ №1:
Я бы рекомендовал взглянуть на это, чтобы лучше понять, как это работает.
Я бы порекомендовал сделать это примерно так:
.container {
position: relative;
text-align: center;
color: white;
}
.plus_own {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
color: red;
font-weight: bold;
}
<div class="container">
<img src="https://cdn.shopify.com/s/files/1/1330/4567/files/DSC_0838_1024x1024.jpg?v=1522089465" style="width:100%;">
<span class="plus_own">Some Text</span>
</div>