CSS将文本与其他元素的居中文本

Question

我试图将文本框中的某些文本居中放置在正确的文本框中。没有文本框，一切看起来都很好。尽管添加时，文本框会抵消标题的居中。

尽管存在另一个元素，是否仍然保持标题居中？ 这里是小提琴 http://jsfiddle.net/poppypoop/WqrXF/

<div style="width: 100%; height: 30px; text-align: center; background-color: lightgray; padding-top: 5px;"> 
Title Here 
<input type="text" style="float: right;" /> 

Answer 1

而不是浮动的输入，它作为absolute位置。这将要求它的容器有一个位置也，所以作出这样的relative

http://jsfiddle.net/rr2WW/

<div style="width: 100%; height: 30px; text-align: center; background-color: lightgray; padding-top: 5px; position: relative;"> 
    Title Here 
    <input type="text" style="position: absolute; right: 0;" /> 
</div> 

Answer 2

给你的文本字段集width和margin-left等于其width负：

<div style="width: 100%; height: 30px; text-align: center; background-color: lightgray; padding-top: 5px;"> 
    Title Here 
    <input type="text" style="float: right; width: 120px; margin-left: -120px;" /> 
</div> 

参见DEMO。