HTML Layout Help

Discussion in 'Web Design and Development' started by EricBrian, Mar 11, 2009.

  1. EricBrian macrumors 6502a

    EricBrian

    Joined:
    Jul 30, 2005
    #1
    Heya.

    So, I have an issue... I have 2 divs within a div and of those 2 divs, div 2 should be right aligned. Can anybody tell me how to do this?

    The HTML is:

    <div>
    <div id="d1" style="display:inline;"> this one should be left aligned.</div>
    <div id="d2" style="display:inline;border:1px solid black;"> this one should be right aligned.</div>
    </div>


    Thanks for the help
     
  2. angelwatt Moderator emeritus

    angelwatt

    Joined:
    Aug 16, 2005
    Location:
    USA
    #2
    There's at least 3 ways to get that effect. What method to use partly depends on the specifics of the layout. Here's one.

    CSS:
    Code:
    #d1 {
     float: left;
     width: 50%;
    }
    #d2 {
     float: right;
     width: 50%;
     border: 1px solid black;
    }
    HTML:
    <div>
    <div id="d1"> this one should be left aligned.</div>
    <div id="d2"> this one should be right aligned.</div>
    </div>
     

Share This Page