对齐放置在页面右侧的按钮左侧的文本

如何将文本放置在页面右侧的按钮左侧，与文本无关尺寸？我现在正在使用绝对位置，但这可能不是一个很好的解决方案。对齐放置在页面右侧的按钮左侧的文本

<nav class="someLine"> 
    <button type="button" class="back">Back</button> 
    <text class="errorMsg">I'm an error!</text> 
    <button type="button" class="continue">Continue</button> 
</nav> 

.errorMsg { 
    color: red; 
    font-weight: bold; 
    font-style: italic; 
    font-size: 10px; 
    position: absolute; 
    right: 120px; 
    margin: 5px; 
} 

.someLine { 
    position: relative; 
    margin: 30px 0px; 
    padding-top: 10px; 
    border-top: 1px solid #DDD; 
} 

.continue, #btnAddProduct { 
    position: absolute; 
    right: 0px; 
}

http://jsfiddle.net/h959khth/

感谢您的反馈！

来源

2015-02-23 crabpeople

为什么看起来绝对定位不是对你很好的解决的解决方案？它工作完美。 – 2015-02-23 08:57:53

你可以使用

float: right;

然后他们会拥抱他们的父母div的右边缘浮动两个元素不管它如何变大。

如果你把它们飘浮确保你有照顾他们的元素与

float: clear;

来源

2015-02-23 08:58:05 1337ingDisorder

我希望这甜食你的需要：

.errorMsg { 
    color: red; 
    font-weight: bold; 
    font-style: italic; 
    font-size: 10px; 
    right: 120px; 
    margin: 5px; 
    position: relative; 
    left: 4% 
}

Live Demo

来源

2015-02-23 08:56:22

使用floatprop，而不是position:absolute;。为了达到你想要的浮动元素，你需要设置position att到relative。观看演示：

DEMO

来源

2015-02-23 09:03:08 mgamon

对齐放置在页面右侧的按钮左侧的文本

回答

相关问题