SitePoint Sponsor

User Tag List

Results 1 to 4 of 4

Hybrid View

  1. #1
    SitePoint Member
    Join Date
    Jul 2000
    Posts
    4
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I'm having continual problems with CSS and netscape, but i think i've nearly got everything sorted except this one thing. I want to layer a table with buttons over another table which just has images on it. I've done the two separately and then wrapped them both in DIV tags, one relatively positioned which goes around both tables, and the one that floats above is absolutely positioned inside the larger DIV. My problem is that Netscape doesn't seem to understand that i want the inner DIV to be absolutely positioned to only the outer DIV, not the edge of the page. Well it sort of understands it because the top is correct, but it keeps moving it to the left.
    One easy solution is to relatively position the inner DIV, but then although Netscape moves the images in the table to the desired position, it leaves the links behind, just floating in space. I am going mad. I have tried applying my positioning styles to the tables, and their rows and even cells, i have tried nesting the tables, but all i get is even more bizarre special effects in netscape.
    at the moment i am contemplating doing a browser detection test and giving netscape users another version. i need this site to work in netscape 4.x, but it's getting really tempting to just ditch the irritating browser.
    anyway, here's the code:


    <head>
    <style>
    #main {position:relative; left:0; top:0; z-index:1}
    #front {position:absolute; left:0; top:104; z-index:2}
    </style>
    </head>

    <body leftmargin=0 topmargin=20 marginwidth=0 marginheight=20>

    <center>
    <div id="main">
    <table width=600 height=140 border=0 cellpadding=0 cellspacing=0>
    <tr>
    <td><img src="images/one.gif" height=140 width=140 border=0></td>
    <td><img src="images/logo1.gif" height=140 width=320 border=0></td>
    <td><img src="images/training1.gif" height=140 width=140></td>
    </tr>
    </table>

    <div id="front">
    <table width=600 height=60 border=0 cellpadding=0 cellspacing=0>
    <tr>
    <td colspan=9><img src="images/captions.gif" width=600></td>
    </tr>
    <tr>
    <td><img src="images/navslice_r1_c01.gif"></a></td>
    <td><a href="docs/upcoming.htm"><img src="images/navslice_r1_c02.gif" border=0></a></td>
    <td><a href="docs/work.htm"><img src="images/navslice_r1_c03.gif" border=0></a></td>
    <td><a href="docs/gallery.htm"><img src="images/navslice_r1_c04.gif" border=0></a></td>
    <td><a href="docs/text.htm"><img src="images/navslice_r1_c05.gif" border=0></a></td>
    <td><a href="docs/contact.htm"><img src="images/navslice_r1_c06.gif" border=0></a></td>
    <td><a href="docs/specials.htm"><img src="images/navslice_r1_c07.gif" border=0></a></td>
    <td><a href="docs/london.htm"><img src="images/navslice_r1_c08.gif" border=0></a></td>
    <td><img src="images/navslice_r1_c09.gif"></a></td>
    </tr>
    </table>
    </div>

    </div>

    </center>
    </body>

    many many thanks if you can help

  2. #2
    twashington
    SitePoint Community Guest
    if your #main table is at 0,0 try changing it from relative to absolute. that will lock it in the corner no matter what else is going on.
    also try closing the main div before opening the front div. i think you are getting your browser cornfused.

    ------------------
    That's just my opinion
    t.washington@visto.com

  3. #3
    The Hiding One lynlimz's Avatar
    Join Date
    Jul 2000
    Location
    Singapore
    Posts
    2,103
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    If I'm correct, under w3 standards, they dun encourage the use of #
    but well..still can use. =) heez!

  4. #4
    SitePoint Addict
    Join Date
    May 2000
    Posts
    229
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Im still a newb so disregard this comment if it sounds elementary, but if your wanting to place 9 images on top of the "one, logo1, and training1" images.

    If those three images are only to be used for looks and not to link from,
    maybe it would be easier to combine those three images into one and set it as a background to a table which will then hold the other nine image links?

    You could build the table to be 600x140 so the background image would fit. and the image links would take the top half of the table.
    (or you could center the links...whatever)

    Does this make any sense?

    i hope it helps you <=(


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
  •