Problems with Column Alignment

Community Forums Forums General Discussion Problems with Column Alignment

This topic is: not resolved

This topic contains 6 replies, has 3 voices, and was last updated by  Susan Nelson 1 year, 8 months ago.

Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
    Posts
  • #6416

    William
    Participant
    Post count: 116

    I’m trying columns on my test site and the results don’t align as I would expect.  Not sure what I’m doing wrong, but I’d appreciate a point in the right direction.

    You can see the issue at http://test.beem.us/about. The second column moves the title over a space and the first line down a line so it’s uneven with the first.

    Here’s the HTML I’m using.

     

    Stuff about me.
    <div class=”one-half first”>
    <h2>About Me</h2>
    I’m a Central Florida native with a background in photography and Information Technology. You can find my photography at <a href=”http://williambeem.com” target=”_blank”>William Beem Photography</a>, views on life in Central Florida at <a href=”http://orlandolocal.com” target=”_blank”>Orlando Local</a>, and I’m blogging turning one of my oldest sites into an <a href=”http://william.beem.us” target=”_blank”>Information Technology</a> blog.
    </div>
    <h2 class=”one-half”>About This Site</h2>
    This site runs on WordPress and uses the Genesis Theme by Studio Press.


    • This topic was modified 1 year, 8 months ago by  William.
    • This topic was modified 1 year, 8 months ago by  William.
    #6435

    Anita
    Participant
    Post count: 7356

    The second half isn’t wrapped in the second column DIV. I don’t see it in Firebug.


    Let me help you customize your theme, responsive header, Buddypress, Agentpress or technical issue!
    Visit me here: Cre8tiveDiva.com | Tweet Me! | Plus Me!
    When asking for help, please provide a link or screen shot showing your problem!

    #6436

    Susan Nelson
    Participant
    Post count: 202

    You need to wrap the 2nd column info in a div called one-half.  You don’t add that class to the h2.  So, it should be:

    <div class=”one-half”>

    <h2>About This Site</h2>
    This site runs on WordPress and uses the Genesis Theme by Studio Press.

    </div>


    Susan Nelson | Oh, Hello Designs | Twitter | Facebook

    #6474

    William
    Participant
    Post count: 116

    Hmm.  You’re right, but that doesn’t seem to correct the issue.  Here’s the current code, but the display remains the same.

     

    Stuff about me.
    <div class=”one-half first”>
    <h2>About Me</h2>
    I’m a Central Florida native with a background in photography and Information Technology. You can find my photography at <a href=”http://williambeem.com” target=”_blank”>William Beem Photography</a>, views on life in Central Florida at <a href=”http://orlandolocal.com” target=”_blank”>Orlando Local</a>, and I’m blogging turning one of my oldest sites into an <a href=”http://william.beem.us” target=”_blank”>Information Technology</a> blog.
    </div>
    <div class=”one-half”></div>
    <h2 class=”one-half”>About This Site</h2>
    This site runs on WordPress and uses the Genesis Theme by Studio Press.</div>


    #6475

    Susan Nelson
    Participant
    Post count: 202

    You still have <h2 class=”one-half”>  Make it just <h2>.


    Susan Nelson | Oh, Hello Designs | Twitter | Facebook

    #6480

    William
    Participant
    Post count: 116

    Perfect!  Thanks for the help.  I think I was staring at it too much to see the obvious.


    #6482

    Susan Nelson
    Participant
    Post count: 202

    No problem! :)


    Susan Nelson | Oh, Hello Designs | Twitter | Facebook

Viewing 7 posts - 1 through 7 (of 7 total)

You must be logged in to reply to this topic.