Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 12 of 12

Thread: Format problem

  1. #1
    New Coder
    Join Date
    Jul 2007
    Location
    Portland, OR
    Posts
    65
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Format problem

    I've just working on this template: http://www.linuxpcs.org/

    I can't see what's breaking the layout at the bottom of the page. Can anyone clue me in?

  • #2
    Regular Coder
    Join Date
    Sep 2007
    Location
    Raleigh, NC
    Posts
    273
    Thanks
    7
    Thanked 59 Times in 52 Posts
    Sure, you're clearing things properly (by putting a clear: both on the footer), but you specify a firm height on the rightcolumn.

    Since the content in rightcolumn extends past 466px, the overflow is appearing on top of the footer.

    The fix is to simply remove the height, and let the float clearing do its job.

  • #3
    New Coder
    Join Date
    Jul 2007
    Location
    Portland, OR
    Posts
    65
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Thank you. That fixed it. Now I see that the left column also has a height amount. If I clear it it stays as short as the text fills in. How do I get the left column to match the length of the right column?

  • #4
    Senior Coder effpeetee's Avatar
    Join Date
    Feb 2007
    Location
    Clapham Junction - London SW
    Posts
    4,885
    Thanks
    228
    Thanked 204 Times in 203 Posts
    Quote Originally Posted by vinoman View Post
    Thank you. That fixed it. Now I see that the left column also has a height amount. If I clear it it stays as short as the text fills in. How do I get the left column to match the length of the right column?
    It may be the Faux Columns thing.

    http://www.alistapart.com/articles/fauxcolumns/

    This url may help.

    Frank
    * Sources (updated: 21.11.2012.
    Using Windows 8 Professional. 64bit with HP Photosmart 5510 printer Very useful site here.

  • #5
    Regular Coder
    Join Date
    Sep 2007
    Location
    Raleigh, NC
    Posts
    273
    Thanks
    7
    Thanked 59 Times in 52 Posts
    Quote Originally Posted by vinoman View Post
    Thank you. That fixed it. Now I see that the left column also has a height amount. If I clear it it stays as short as the text fills in. How do I get the left column to match the length of the right column?
    There's really not a great cross-browser way of making this happen short of faux columns. That's just a consequence of IE's spotty handling of CSS2.

    With the way you have your layout (the thin border around the left column) your only real option would be to dynamically increase the height of the left column with Javascript on pageload to match that of the right column. Faux columns won't really work for you because of the border you chose in your design.

  • #6
    New Coder
    Join Date
    Jul 2007
    Location
    Portland, OR
    Posts
    65
    Thanks
    0
    Thanked 0 Times in 0 Posts
    I haven't used javascript before. Where would I find out about how to use it for this layout?

  • #7
    Supreme Master coder! _Aerospace_Eng_'s Avatar
    Join Date
    Dec 2004
    Location
    In a place far, far away...
    Posts
    19,291
    Thanks
    2
    Thanked 1,043 Times in 1,019 Posts
    ||||If you are getting paid to do a job, don't ask for help on it!||||

  • #8
    New Coder
    Join Date
    Jul 2007
    Location
    Portland, OR
    Posts
    65
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Thank you. I'll check it out.

  • #9
    Senior Coder twodayslate's Avatar
    Join Date
    Mar 2007
    Location
    VA
    Posts
    1,042
    Thanks
    67
    Thanked 39 Times in 39 Posts
    twitter | Quality Hosting - $5.95/mo*
    Feel free to PM me!

  • #10
    New Coder
    Join Date
    Jul 2007
    Location
    Portland, OR
    Posts
    65
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by _Aerospace_Eng_ View Post
    Look at page now: http://www.linuxpcs.org/

    I used the java script as per the article you mentioned. I don't think its working though. I also set the left column to 508px to match the right column. But if I make the right column longer will the left column match it?

    Should I get rid of the column height in the left column?

  • #11
    New Coder
    Join Date
    Jul 2007
    Location
    Portland, OR
    Posts
    65
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by twodayslate View Post
    Would I copy and paste this javascript into my body tags? the article doesn't tell you what to do with it.

  • #12
    Senior Coder twodayslate's Avatar
    Join Date
    Mar 2007
    Location
    VA
    Posts
    1,042
    Thanks
    67
    Thanked 39 Times in 39 Posts
    Basically. You just have to have the correct classes.
    twitter | Quality Hosting - $5.95/mo*
    Feel free to PM me!


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •