Jump to content

Positioning Title With Both Right And Left...


username132
 Share

Recommended Posts

Here are two images; one of what I have and the other of what I'm trying to acheive. http://username132.tasminslair.com/wrong.jpg http://username132.tasminslair.com/right.jpg You'll notice that right.jpg shows the text at the top, wrapped according to a distance from the left that I wish to provide. The problem arises because I use a random quote script to insert a random quote at the top of the page, but it's sometimes so long that it goes behind the logo. I've tried padding-left and margin-left but neither work. My code is currently (wrong.jpg); #random_quote { color: #9a6f20; font-weight: 900; font-style: italic; float: right; position: absolute; top: 15px; right: 20px; } If you go to http://username132.tasminslair.com/Seans%2...0Website/pages/ you can see an alternative with; #random_quote { color: #9a6f20; font-weight: 900; font-style: italic; position: absolute; left: 250px; top: 15px; right: 20px; } but this isn't really much use because it look much better when it is aligned to the right. Text-align: right is no good, because then the text after the line-wrap is also aligned right (like your address at the top of a letter).

Link to comment
Share on other sites

I tried margin-left again and it's fixed it in Opera and Firefox, but I.E. ignores the margin-left completely, regardless of value. Should I use a transparent gif to push the text into line?#random_quote {color: #9a6f20;font-weight: 900;font-style: italic;float: right;position: absolute; top: 15px; right: 20px;margin-left: 250px;

Link to comment
Share on other sites

I notice you didn't set any width for your random_quote div. It should have a width of your page - your logo on the left. and then the text should stay within the boundaries. Make sure to leave your margin-left there so it's placed on the right of your logo.

Link to comment
Share on other sites

The problem with that is giving a width causes the phrase to move to the left of its container. I want it to be left-justified but to be as over to the right as possible. You can see it in action here;http://username132.tasminslair.com/Seans%2...esheets/all.cssas opposed to what I'm after (in Moz/Opera), here;http://username132.tasminslair.com/live/stylesheets/all.css

Link to comment
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
 Share

×
×
  • Create New...