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 5 of 5
  1. #1
    New to the CF scene
    Join Date
    Jan 2008
    Posts
    5
    Thanks
    4
    Thanked 0 Times in 0 Posts

    Centering layout problems

    Ahoy. As a note, I hate divs. They're far more complicated than tables to use for layouts, never do what I expect, and it has taken me all day to get this far.
    I've built my layout in Photoshop and exported it in div slices. Unfortunately it's positioned absolutely, and I want it centered. It's a fixed width layout, and I haven't bothered altering it much from its exported state yet, as I don't want to get too far implementing it only to realise that I just can't do this with divs.

    If you need to see the layout, it's at http://www.subtle-edge.com. I'd be most grateful for any help anybody could give me!

  • #2
    Master Coder Excavator's Avatar
    Join Date
    Dec 2006
    Location
    Alaska
    Posts
    9,675
    Thanks
    22
    Thanked 1,827 Times in 1,811 Posts
    Code:
    #Table_01 {
    margin: 0 auto;
    	width:1024px;
    position: relative;
    }
    That should center it. margin: 0 auto; is the bit that centers, position: relative; makes all that absolute positioning work inside #Table_01...
    Validate often DURING development - Use it like a splelchecker | Debug during Development |Write it for FireFox, ignore IE
    Use the right DocType | Validate your markup | Validate your CSS | Why validating is good | Why tables are bad

  • Users who have thanked Excavator for this post:

    Throlkim (01-02-2008)

  • #3
    New to the CF scene
    Join Date
    Jan 2008
    Posts
    5
    Thanks
    4
    Thanked 0 Times in 0 Posts
    Hurrah! Many thanks! That's saved me no end of bother and annoyance. I was confused by what the position attribute applied to methinks.

    Again, thank you very much for the help!
    Maybe I'll get the hang of div layouts eventually.

  • #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
    Again, thank you very much for the help!
    Maybe I'll get the hang of div layouts eventually.
    If you do! Please let me into the secret.

    Frank
    Last edited by effpeetee; 01-02-2008 at 07:48 AM.
    * Sources (updated: 21.11.2012.
    Using Windows 8 Professional. 64bit with HP Photosmart 5510 printer Very useful site here.

  • #5
    Senior Coder ahallicks's Avatar
    Join Date
    May 2006
    Location
    Lancaster, UK
    Posts
    1,134
    Thanks
    1
    Thanked 57 Times in 55 Posts
    Quote Originally Posted by Throlkim View Post
    Hurrah! Many thanks! That's saved me no end of bother and annoyance. I was confused by what the position attribute applied to methinks.

    Again, thank you very much for the help!
    Maybe I'll get the hang of div layouts eventually.
    I think after a while you will certainly find that layouts not created with tables are so much easier than those created with because firstly there will be plenty less code to crawl through in search of errors. They are also more easily controlled by style sheets as they are what style sheets were made to style.

    Think of layouts using divisions as exactly what they sound like they should be... divide the page up into it's separate parts. That should be all you need for a 'div' layout, usually no more than 5 or 6 divs are really needed for a layout with a few bits and pieces. All of the other sections of your page should be in their own relevant tags such as lists inside <ul>'s and paragraphs inside <p>'s. Get your head around semantics and things will fit easily and you'll winder why you ever thought to use a table in the first place :-)
    "write it for FireFox then hack it for IE."
    Quote Originally Posted by Mhtml View Post
    Domains are like women - all the good ones are taken unless you want one from some foreign country.
    Reputation is your friend

    Development & SEO Tools


  •  

    Posting Permissions

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