How do i Center website both horizontally and vertically in dreamweaver?

Discussion in 'Web Design and Development' started by rema, Jul 27, 2007.

Most Liked Posts
  1. rema, Jul 27, 2007

    rema macrumors regular

    Joined:
    Sep 16, 2006
    #1
    Really struggling to do this I want the site to sit in the middle of the screen, I’ve managed to center it vertically but the space above and bellow is odd,

    Any help would really be great,

    Cheers rema

    any one?
     
    share
    + Quote Reply
  2. Mitthrawnuruodo, Jul 27, 2007

    Mitthrawnuruodo Moderator emeritus

    Mitthrawnuruodo

    Joined:
    Mar 10, 2004
    Location:
    Bergen, Norway
    #2
    There was a thread about this just the other day, but since I'm too lazy to search for it, I'm just going to post one way of doing it... ;)

    Mind you this uses tables for layout, which is frowned upon, but it works and validates, which is most important to me:

    HTML:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">   
    <title></title>
    <style type="text/css">
      html, body { height: 100%; padding: 0; margin: 0; }
      table { text-align: center; height: 100%; width: 100%; border: 0; }
    </style>
  </head>
  <body>
    <table>
      <tr>
        <td>
        <!-- Place contents here for absolute centering -->
          
        </td>
      </tr>
    </table>
  </body>
</html>
     
    share
    + Quote Reply
  3. RojoLeo, Jul 27, 2007

    RojoLeo macrumors 6502

    Joined:
    Mar 11, 2007
    Location:
    Austin, TX
    #3
    Here is the thread.

    Or to sum it up: Go here and steal the code. Explained more here.

    ;)
     
    share
    + Quote Reply
  4. rema, Jul 28, 2007

    rema thread starter macrumors regular

    Joined:
    Sep 16, 2006
    #4
    thanks you two i will give it ago and tell you guys hows it goes,

    thanks again rema
     
    share
    + Quote Reply
  5. djsound, Feb 6, 2010

    djsound macrumors 6502a

    djsound

    Joined:
    Dec 4, 2006
    #5
    share
    + Quote Reply
  6. carlosbutler, Feb 6, 2010

    carlosbutler macrumors 6502a

    carlosbutler

    Joined:
    Feb 24, 2008
    Location:
    London City
    #6
    I just quickly read of the previous posts, not links or anything.

    But if this is something you are looking for it is fairly easy.

    All you need to do:
    First, get the harder vertical out the way - if you know the height you want the main thing to be, then its pretty easy. Lets say the main box to be in the middle of the screen is 500px X 300px.

    You need to create a div, say 'horizon' that is 50% from the top, and 100% wide with and absolute position. Then create another div in that is 50% left, and in this case has margin-left set to -250px and margin-top set to -150px.

    This should work, you are restricted to a set hight and width thought. Also make sure you don't use absolute positioning unless you have to.
     
    share
    + Quote Reply
(You must log in or sign up to post here.)

Share This Page