Given this simplified snippet :
<html>
<body>
<div>
<div style='text-align:center;'>asdfaskjdfakjsd</div>
<div style='float:right'>
<input type='submit' value='asdf' />
</div>
</div>
</body>
</html>
The button floats to the right, but below the text(On the next line). I know I can realign it using relative positioning, but is there a correct way of having both on the same line.
Even better if adding the button on the right would not effect the centre align of the text. ie it does not get pushed to the left.
I apologize for jumping around. I noticed that even with the reversed divs, the text didn’t appear completely centered.
Here is yet another solution (5th example): http://jsfiddle.net/tracyfu/zYzqr/
The only problem with this is that if you’re not careful, or your text is dynamic, it could collide with the absolutely positioned submit.