Poravnava inline-block elementov na desno v CSS
Poravnajmo element na desno:
<div class="parent">
<span class="child">text</span>
</div>
.parent {
text-align: right;
padding: 10px 0;
border: 1px solid red;
}
.child {
display: inline-block;
padding: 10px 20px;
border: 1px solid green;
}
:
Podan je div znotraj nekega starša:
<div class="parent">
<div class="child">text</div>
</div>
.parent {
padding: 10px 0;
border: 1px solid red;
}
.child {
padding: 10px;
border: 1px solid green;
}
Spremenite div-potomec v inline-block element, nato ga poravnajte na desno stran starša.
Spremenite prejšnjo nalogo tako, da se
div ne prilega tesno na desni rob.
Za to starševskemu elementu dodajte
desni padding.
Spremenite prejšnjo nalogo tako, da se
div ne prilega tesno na desni rob.
Za to elementu-potomcu postavite desni
margin.
Podana je povezava znotraj nekega starša:
<div class="parent">
<a href="" class="child">text</a>
</div>
.parent {
padding: 10px 0;
border: 1px solid red;
}
.child {
width: 100px;
padding: 10px;
border: 1px solid green;
}
Spremenite povezavo v inline-block element, nato ga poravnajte na desno stran starša.
Spremenite prejšnjo nalogo tako, da bo besedilo znotraj povezave poravnano na sredino te povezave.