我有問題,我無法將 div 中的物件(在這種情況下是按鈕)移動到一側。
我有這個HTML:
<div class='post-div'>
<h1>There will be title</h1>
<div class='post-content-and-actions'>
<div class='peace-of-content'>
<p>Here will be a little bit of content and Lorem ipsum</p>
</div>
<div class='actions'>
<button class='edit'>EDIT</button>
<button class='edit delete'>DELETE</button>
</div>
</div>
</div>
并且css:
.post-div {
width: 1000px;
height: 150px;
padding: 8px;
.post-content-and-actions {
width: 100%;
display: flex;
.peace-of-content {
width: 700px;
}
.actions {
width: 300px;
.edit {
width: 100px;
height: 30px;
font-size: 15px;
background-color: green;
&.delete {
background-color: red;
}
}
}
}
}
在actions部分中,我想將所有按鈕向右移動,無論我做什么,我都做不到。float: right,right: 0等等。其實,我不知道為什么!
uj5u.com熱心網友回復:
您可以添加text-align: right;到.actions:
...
.actions {
width: 300px;
text-align: right;
...
uj5u.com熱心網友回復:
Flexbox 可以輕松實作這一點..
.actions {
display: flex;
justify-content: flex-end;
width: 300px;
.edit {
width: 100px;
height: 30px;
font-size: 15px;
}
轉載請註明出處,本文鏈接:https://www.uj5u.com/houduan/397281.html
上一篇:如何制作?與常規空間的寬度相同?
