如何在不使用絕對位置的情況下從右側阻止 div 的寬度擴展？

Question

我想創建一個 div 元素，當我們在其中添加任何內容時，該元素僅從左側擴展。

<div 
    id="sent_message"
    style='background-color: #2b89cc; color: white; font-family: Arial,Helvetica, sans-serif; margin-top: 10px; display: inline-block; max-width: 50%; min-width: 20%; font-size: 25px; border-radius: 5px; word-wrap: break-word; position: relative; right: -1360;'>
    <p>Hello</p>
</div>

我不希望使用position:absolute這項工作。 有沒有辦法阻止div從右側擴展？ 我會很高興回答。

Answer 1

使用float:right

 window.setTimeout(function(){ document.querySelector('#sent_message p').innerHTML = 'Hello World, welcome!'; }, 1000);

 #sent_message { background-color: #2b89cc; color: white; font-family: Arial, Helvetica, sans-serif; margin-top: 10px; display: inline-block; max-width: 50%; min-width: 20%; font-size: 25px; border-radius: 5px; word-wrap: break-word; position: relative; float: right; }

 <div id="sent_message"> <p>Hello</p> </div>