Text alignment

  • Author
    Posts
  • #1949780

    bluewomble88
    Member

    I’m really new to this so please forgive me.

    I have a page set up with some text on it. I want to have 2 hyperlinks at the bottom, one that says “back to previous page” aligned left, and other saying “next page” right aligned but both on the same line.
    Is this possible? If so, how do I do it?

    Many thanks.

    The blog I need help with is dub3designs.wordpress.com.

    #1949912

    Hi bluewomble88,

    If you were using posts instead of pages this could be taken care of automatically for you.

    However I’m guessing you want to do it with your What We Do pages.

    You could try something like this. You would need to do it in the text editor instead of the visual editor.

    But for example the Design page under What We Do

    If you find the area in the part that does the link to the Creation page. Something like
    <a title="Creation" href="http://dub3designs.wordpress.com/whatwedo/creation/">Go to CREATION >>></a>

    You could try replacing it with something like this

    <p style="text-align:right;">
      <a style="float: left;" title="What We Do" href="http://dub3designs.wordpress.com/whatwedo/"><<< Go to What We Do</a>
      <a title="Creation" href="http://dub3designs.wordpress.com/whatwedo/creation/">Go to CREATION >>></a>
    </p>

    I believe that would give you what you are looking for.
    Let me know if that makes sense.

    #1949914

    bluewomble88
    Member

    Hi

    Thank you for your reply.

    I did what you said and it almost works. The trouble is the two hyperlinks are on different lines and I’d like them to be on the same line.

    Any ideas?

    Thanks.

    #1949915

    Ah I think I see what happened.
    Try it like this where the two a tags are on the same line.

    <p style="text-align:right;">
      <a style="float: left;" title="What We Do" href="http://dub3designs.wordpress.com/whatwedo/"><<< Go to What We Do</a><a title="Creation" href="http://dub3designs.wordpress.com/whatwedo/creation/">Go to CREATION >>></a>
    </p>
    #1949919

    bluewomble88
    Member

    Thank you. This works now.

    But, I can’t see what you changed. Both codes look the same.

    Would you mind pointing out what was causing the first problem?

    Many thanks.

    #1949923

    Great glad it works.
    The difference is that in the first bit of code I had each of the <a tags on their own line.
    In the second bit I put them on the same line so the closing of the first was right next to the <a opening of the second. So a simplified version.

    <a style="float: left;" href="yourlink">Link</a><a href="yourlink">Link</a>

    Instead of

    <a style="float: left;" href="yourlink">Link</a>
    <a href="yourlink">Link</a>

    Does that make sense?

    #1949967

    bluewomble88
    Member

    Yes, a bit!

    Obviously I’m wrong, but I thought it didn’t matter if a new line was started or not because the code is read left to right and doesn’t see the spaces.

    In other words, in HTML 5 pressing the return key 5 times and then starting with <p> doesn’t place the new text 5 lines down, but one.

    Sorry, as you can tell I’m pretty new to this.

    #1949968

    timethief
    Member

    In other words, in HTML 5 pressing the return key 5 times and then starting with <p> doesn’t place the new text 5 lines down, but one.

    Blog editors and word processors are not the same and do not work the same way. The web standard is one blank line only, so you cannot add more blank lines by pressing return repeatedly like you would do with a typewriter or in a word processing application. If you want to learn how to format and space your posts and pages see: http://onecoolsitebloggingtips.com/2011/09/13/wordpress-formatting-and-spacing/

    #1949982

    Hi bluewomble88,

    Your understanding is pretty much right.
    However when I looked at the source of your page after you put in the first code I sent it looked like this.

    <p style="text-align:right;">
      <a style="float: left;" title="What We Do" href="http://dub3designs.wordpress.com/whatwedo/"><<< Go to What We Do</a>
    <br></br>
      <a title="Creation" href="http://dub3designs.wordpress.com/whatwedo/creation/">Go to CREATION >>></a>
    </p>

    With a the line break tag in between the two tags. This caused them to be not in line with each other.
    In order to eliminate that line break tag from getting in there I suggested putting the two
    tags on the same line.

The topic ‘Text alignment’ is closed to new replies.