如何在将div右对齐的同时水平对齐div

Question

我正在尝试将输入文本和您在下图中看到的所有按钮对齐到“我的文本”的底部。

底部应该是M的底部而不是y的底部。 编辑：作为第二选择，所有元素都可以与“我的文字”的垂直中心对齐。

按钮3和4必须向右对齐。

如果没有足够的空间，My text应该保留在第一行，其余的应该换行。

我尝试使用float: right时没有运气，因为按钮3和4位于右上边缘。我尝试以内联方式显示它们，但那样一来它们就不会在右侧对齐。我不知道还能尝试什么。

下面是我当前的代码，它使我与Firefox底部对齐，但与Chrome底部对齐（如您所见，按钮3和4与按钮1和2不对齐）

我希望有人能帮助我。

div.inline { 
display: inline-block;
}

			
<div id="titleBar">
<div class="inline" style="position: relative; width: 100%;">
	<div class="inline" style="font-weight: bold; font-size: 2em; color: #D00000;">My text</div>
	<div class="inline">
		<form>
			<div class="inline">
				<input type="text" style="width: 16em" value="input text">&nbsp;
			</div>
			<div class="inline">
				<input type="submit" value="button 1"></input>
				<button>button 2</button>
			</div>
		</form>
	</div>

	<div style="position: absolute; bottom: 0px; right: 0px;">
		<button >button 3</button>
		<button >button 4</button>
	</div>
</div>
</div>