Menu
I have two <span> elements:
<span style="margin-right:auto;">©2012 XYZ Corp. All Rights Reserved.</span>
<span style="margin-left:auto;">Built with <a href="http://www.wordpress.org/">Wordpress</a> and hosted by <a href="http://www.mediatemple.net/">(mt)</a> in California.</span>
I want the first <span> to be on the left of the page and the second <span> to be on the right side, regardless of page width (so I can't use fixed positioning).
What CSS can I use to do this?
414
The most common way to place two divs side by side is by using inline-block css property. The inline-block property on the parent placed the two divs side by side and as this is inline-block the text-align feature worked here just like an inline element does.
Maybe try a (non breaking space) in between the spans. Show activity on this post. Overflow maybe? @OP has been set float:left to the span. to make it to be in one line put overflow hidden to the div.
Solutions with CSS properties If you want to align a <span> element to the right of the <div>, you can use some CSS. Particularly, you need to use the float property with the “right” and “left” values.
The css variable float is used to position your elements.
The options are:
float:left;
float:right;
float:none;
<span style="float:left;">©2012 XYZ Corp. All Rights Reserved.</span>
<span style="float:right;">Built with <a
Here is working example:
<span style="float:left; color: red;">©2012 XYZ Corp. All Rights Reserved.</span>
<span style="float:right; color: blue;">Built for example</span>If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
