Выраўноўванне буйна-блачных элементаў па правым краі ў CSS
Выраўнуем элемент па правым краі:
html<div class="parent">
<span class="child">text</span>
</div>css.parent {
text-align: right;
padding: 10px 0;
border: 1px solid red;
}
.child {
display: inline-block;
padding: 10px 20px;
border: 1px solid green;
}
Результат:
Задание 1
Дадзены дыў унутры некаторага бацькі:
html<div class="parent">
<div class="child">text</div>
</div>css.parent {
padding: 10px 0;
border: 1px solid red;
}
.child {
padding: 10px;
border: 1px solid green;
}
Пераўтварыце дыў-нашчадак у буйна-блачны элемент, затым выраўнуйце яго па правым краі бацькі.
Задание 2
Мадыфікуйце папярэднюю задачу так, каб
дыў не прыціскаўся шчыльна да правага краю.
Для гэтага бацькоўскаму элементу дадайце
правы padding.
Задание 3
Мадыфікуйце папярэднюю задачу так, каб
дыў не прыціскаўся шчыльна да правага краю.
Для гэтага элементу-нашчадку пастаўце правы
margin.
Задание 4
Дадзена спасылка ўнутры некаторага бацькі:
html<div class="parent">
<a href="" class="child">text</a>
</div>css.parent {
padding: 10px 0;
border: 1px solid red;
}
.child {
width: 100px;
padding: 10px;
border: 1px solid green;
}
Пераўтварыце спасылку ў буйна-блачны элемент, затым выраўнуйце яго па правым краі бацькі.
Задание 5
Мадыфікуйце папярэднюю задачу так, каб тэкст унутры спасылкі быў выраўнаваны па цэнтры гэтай спасылкі.