Я пытаюсь позиционировать текстовый элемент "Ставка 5 дней назад" в нижнем правом углу. Как я могу это сделать? И, что еще более важно, объясните, чтобы я мог завоевать CSS!
CSS: как позиционировать элемент в правом нижнем углу?
Ответ 1
Давайте скажем, что ваш HTML выглядит примерно так:
<div class="box">
<!-- stuff -->
<p class="bet_time">Bet 5 days ago</p>
</div>
Затем с помощью CSS вы можете сделать этот текст в правом нижнем углу так:
.box {
position:relative;
}
.bet_time {
position:absolute;
bottom:0;
right:0;
}
Как это работает, так это то, что абсолютно позиционированные элементы всегда позиционируются относительно первого относительно позиционированного родительского элемента или окна. Поскольку мы устанавливаем положение окна относительно, .bet_time позиционирует правый край к правому краю .box, а его нижний край - к нижнему краю .box
Ответ 2
Установите CSS position: relative; в поле. Это приводит к тому, что все абсолютные положения объектов внутри будут относиться к углам этого окна. Затем установите следующий CSS в строке "Bet 5 дней назад":
position: absolute;
bottom: 0;
right: 0;
Если вам нужно коснуться текста дальше от края, вы можете изменить 0 на 2px или аналогичный.