Close

Results 1 to 6 of 6
  1. #1
    DF VIP Member Pyro Steve's Avatar
    Join Date
    Nov 2000
    Location
    Down South
    Posts
    592
    Thanks
    0
    Thanked:        0
    Karma Level
    314

    Default Centre align a layer...help

    Ello guys, Im learning to use Adobe GoLive at the mo and generally getting upto date on webdesign..come across a problem I cant work out...

    How do you make a layer centre align itself as you resise a browser window? Ive played with position relative and absoulte but cant get it to move..just stays in one place no matter how u resise the browser window.

    How do you do this? Do you have to use "floating layers"?

    Ive been goolging it but cant find anything which helps, well at least I understand yet lol

    Anyone...?

  2. #2
    DF VIP Member /dev/null's Avatar
    Join Date
    Feb 2004
    Location
    Behind You
    Posts
    2,952
    Thanks
    0
    Thanked:        0
    Karma Level
    450

    Default Re: Centre align a layer...help

    How are you doing this exactly? Any chance of posting some code? Are you doing it using DIV tags?

  3. #3
    DF VIP Member Pyro Steve's Avatar
    Join Date
    Nov 2000
    Location
    Down South
    Posts
    592
    Thanks
    0
    Thanked:        0
    Karma Level
    314

    Default Re: Centre align a layer...help

    Ive manged to get it working now using java to create a floating layer which always "floats" to be in the centre of the page when the browser is resized. Perfect.

    Cheers for the offer of help anyways

  4. #4
    DF VIP Member RaggoVibes's Avatar
    Join Date
    Mar 2002
    Location
    London
    Posts
    823
    Thanks
    3
    Thanked:        0
    Karma Level
    377

    Default Re: Centre align a layer...help

    You don't need to use Javascript to center a DIV (layer)

    Here's the CSS:

    body{
    text-align: center; /* sorts out a bug in old versions of IE */
    }


    #wrapper{
    width: 770px;
    margin: auto; /* This centres it. */
    text-align:left; /* Re-align the text back*/
    }


    In the HTML you open the body tag and then open the wrapper ID and include all the contents of the page within the wrapper. Finally you close the wrapper and then the body.
    <body>
    <div id="wrapper">


    </div>
    </body>


    Let me know if you have any trouble.
    Last edited by RaggoVibes; 20th August 2006 at 01:02 PM.

  5. #5
    DF VIP Member Pyro Steve's Avatar
    Join Date
    Nov 2000
    Location
    Down South
    Posts
    592
    Thanks
    0
    Thanked:        0
    Karma Level
    314

    Default Re: Centre align a layer...help

    cheers Raggovibes..that will make the coding a lot nicer..will give it a whirl

  6. #6
    DF VIP Member fin23's Avatar
    Join Date
    Aug 2006
    Location
    UK
    Posts
    587
    Thanks
    0
    Thanked:        0
    Karma Level
    249

    Default Re: Centre align a layer...help

    or if for some reason your auto values on your margins don't work you could use the Negative margin option

    where you align your wrapper div 50% from left, then add a negative vlaue half the total width of the wrapper div.. ermm.. like below

    .wrapper {
    position: relative;
    left: 50%;
    margin-left:-375px;
    width:770px; }

    Just another option. Will always be centered, i think some browsers inprete the auto margin value differently.

Similar Threads

  1. Off Centre TV Show, cancelled :(
    By _/N$@N!TY_ in forum The Dog and Duck
    Replies: 5
    Last Post: 22nd October 2002, 07:51 PM
  2. GTA:Vice city will be on Dual layer dv9 format ??
    By AseerAlHob in forum Sony Consoles
    Replies: 16
    Last Post: 12th October 2002, 03:22 PM
  3. how do i re-align my laser on my PS2
    By DeltamdX in forum Sony Consoles
    Replies: 3
    Last Post: 4th October 2002, 10:07 AM
  4. Asylum Centre
    By Mercedes1 in forum The Dog and Duck
    Replies: 5
    Last Post: 14th September 2002, 07:56 PM

Social Networking Bookmarks

Posting Permissions

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