Sign in to follow this  

[web] Mixing left- and right-align on one line.

Recommended Posts

spraff    100
Hello. I have inline elements in a paragraph p tag. I want the first of them to be left-aligned as normal and the rest to be right-aligned. I was hoping something like this would work <p>left left elft <span style="text-align:right">right right right</span></p> But that doesn't work, even giving the p a style of "width:100%" and the span "margin-left:auto;float:right" and other fiddling doesn't seem to help. At the moment all I can do that works is <p style="float:left">left left left</p><p style="float:right">right right right</p> The trouble now is the next block element flows up and underneath the two <p>s! I'm running out of ideas. Help!

Share this post

Link to post
Share on other sites
ToohrVyk    1596
To float an element, you must specify a width for that element. Otherwise, display will be random on the various browsers (it's already hard to get cross-browser displays with conforming code).

I would suggest:

<p style="float:left;    text-align:left;    width:50%">Left</p>
<p style="float:right; text-align:right; width:50%">Right</p>
<p style="clear:both">Below</p>

Share this post

Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

Sign in to follow this