www.webdeveloper.com
Results 1 to 3 of 3

Thread: Centering DIV Layers + floating over a table

  1. #1
    Join Date
    Apr 2007
    Location
    The Land of the Forbidden
    Posts
    2

    Centering DIV Layers + floating over a table

    Hi everyone,

    I've been trying to set up a DIV layer in my website. I would like it to be in the center, and to be 570 pixels wide, and 400 pixels from the top. I do not want to set a height for it because I want it to extend as much as there is text. I also want it to float over a table. So far, however, I have not been able to do this.

    Here's my HTML code (saved as a text file):
    Download index.txt

    Here's my CSS code:
    Download delac.css

    As you can see, the problem with this CSS code is that the DIV Layer is starting from the absolute center of the page (although it's starting 400 pixels from the top, and is floating over the table).

    What can I do to fix this problem?

    I would greatly appreciate it if you downloaded the files and worked on them, because then you'll truly see the problem (and hopefully, have a better chance of fixing it).

    I did not upload the images which make up the table and the background image because it was not necessary. However, the table will be visible.

    Once again, I would like the layer:
    1. To be in the center of the page
    2. To be 570 pixels wide
    3. To start 400 pixels from the top
    4. To float over the table


    In addition, I would like the text in the layer...
    5. To be aligned on the left

    I tried several codes, one of which was this:

    Code:
    #layer1{
    border : 0px none;
    margin : auto;
    text-align : left;
    width : 570px;
    top: 400px;
    }
    But this code made the DIV layer start under the table rather than 400 pixels from the top.

    If anyone could help me fix this problem by fulfilling all 5 "conditions" that I listed earlier, I would greatly appreciate it.

  2. #2
    Join Date
    May 2005
    Posts
    2,040
    Things you want to look at:
    1) You need a proper doctype. See my link below. Use html4.01 strict.
    2) Do not call divs 'layers'. Divs can be placed in a z-layer but they aren't always layers and they aren't in this case.
    3) You shouldn't use tables for layout.

    EDIT: Well, now that I look at this, I can see why you could call it a layer.
    Last edited by drhowarddrfine; 04-24-2007 at 07:39 AM.

  3. #3
    Join Date
    Apr 2007
    Location
    The Land of the Forbidden
    Posts
    2
    Why shouldn't I use a table in my layout? Do you have any suggestions for something else I could use?

    I'm afraid that I have to use a table because the image is large and needs to be split up, otherwise it will take too much time to load.

    If you (or anyone) could figure out a way where I could use a DIV layer with the five conditions I specified in my first post, along with a table, I would greatly appreciate it.

    Once again, I highly recommend you download the files (and save the text file as an HTML file) so you can see the problem.

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

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



Recent Articles