SitePoint Sponsor

User Tag List

Results 1 to 3 of 3

Hybrid View

  1. #1
    will code HTML for food Michel V's Avatar
    Join Date
    Sep 2000
    Location
    Corsica
    Posts
    552
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    The way this page displays is a bit too slow because of the time spent at rendering the huge tables, so I would switch to DIVs as soon as possible.
    Here's my question:

    How do you do absolute positionning in a centered table of a fixed width ?
    [blogger: zengun] [blogware contributor: wordpress]

  2. #2
    SitePoint Wizard creole's Avatar
    Join Date
    Oct 2000
    Location
    Nashvegas Baby!
    Posts
    7,845
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I don't think that you can absolutely position a table that you want centered. That is the nature of absolutely positioned elements. They are in one place.

    Take a look at this site:
    http://www.thenoodleincident.com/tut...us_topbox.html

    They talk about doing exactly what you are wanting.
    Adobe Certified Coldfusion MX 7 Developer
    Adobe Certified Advanced Coldfusion MX Developer
    My Blog (new) | My Family | My Freelance | My Recipes

  3. #3
    SitePoint Guru sowen's Avatar
    Join Date
    Feb 2001
    Location
    Stockport, UK
    Posts
    729
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    You can sort of do it with DIVs in IE, with a bit of JavaScript.

    <html>
    <head>
    <title>Untitled Document</title>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    <script>
    window.onload=fnInit;

    function fnInit(){
    oDiv.style.setExpression("left",
    "document.body.clientWidth/2 - oDiv.offsetWidth/2"
    );
    }
    </script>

    </head>

    <body>
    <div id="oDiv" style="background-color: #CFCFCF;
    position: absolute;
    top: 0;
    left: 0;
    width: 75%">Some stuff That goes into the first bit
    <div style="background-color: #fc6600;
    top: 100px;
    left: 0px;
    width: 50%">
    The main centred &lt;div&gt; can hold nested versions that reletively position themselves within the main &lt;div&gt;
    </div>
    </div>
    </body>
    </html>


    The document.body.clientWidth reads the (IE) browser window size not the resolution so it scales when you resize. The code for netscape is apparently window.innerWidth (thanks to bman for that one) I havn't tested th NS one yet.

    You can replace the % widths with px widths and it still works.

    Hope this is some help


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
  •