CSS-de setir-blok elementleriň sag tarapynda deňleşdirmek
Elementi sag tarapynda deňleşdireris:
html<div class="parent">
<span class="child">tekst</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
Belli bir ata elementiň içinde bir div berlen:
html<div class="parent">
<div class="child">tekst</div>
</div>css.parent {
padding: 10px 0;
border: 1px solid red;
}
.child {
padding: 10px;
border: 1px solid green;
}
Div-çagany setir-blok elementine öwüriň, soňra ony ata elementiniň sag tarapynda deňleşdiriň.
Задание 2
Öňki meseläni üýtgediň, şonuň üçin
div ata elementiniň sag tarapyna ýapyşyp galmasyn.
Bun üçin ata elementine sag padding goşuň.
Задание 3
Öňki meseläni üýtgediň, şonuň üçin
div ata elementiniň sag tarapyna ýapyşyp galmasyn.
Bun üçin çaga elementine sag
margin goýuň.
Задание 4
Belli bir ata elementiň içinde bir çykgyt berlen:
html<div class="parent">
<a href="" class="child">tekst</a>
</div>css.parent {
padding: 10px 0;
border: 1px solid red;
}
.child {
width: 100px;
padding: 10px;
border: 1px solid green;
}
Çykgydy setir-blok elementine öwüriň, soňra ony ata elementiniň sag tarapynda deňleşdiriň.
Задание 5
Öňki meseläni üýtgediň, şonuň üçin çykgyt içindäki tekst şol çykgytda merkezde deňleşdirilsin.