Register

If this is your first visit, please click the Sign Up now button to begin the process of creating your account so you can begin posting on our forums! The Sign Up process will only take up about a minute of two of your time.

Results 1 to 6 of 6
  1. #1
    Senior Member raspberryh's Avatar
    Join Date
    Aug 2004
    Location
    Erie, PA
    Posts
    882
    Member #
    7208
    Liked
    1 times
    hi,

    i am working on a website that i've built with tables, but 1 thing needed to be absolutely positioned (because of the design of the website), which was the logo at the top. it also needed to be centered in the page.
    so i made a div that holds a table of width 100% with the logo in it.
    so anyways, the logo is the only thing on this layer, but the layer does expand horizontally to 100% of the browser width.
    so, the table covers up two buttons - but the table is transparent, so you can't tell by looking at it. but it does cover them.
    so the problem is, if i link the buttons to anything, they aren't clickable!
    i haven't done anything in-depth enough with layers to really know if there is a solution to this or not - does anyone know of a simple solution?
    (i guess i can't set the z-index of the button b/c it is not absolutely positioned - it's in the table cells)

    oh yeah and one more thing... i know most people here may want to respond with "you should never use html tables for your layout - css only" and i know that you feel that way, but i like using tables for my layouts.

    anyways, thanks for any help!!!
    heather
    choosy developers choose gif!
    website | paintings | blog

  2.  

  3. #2
    Senior Member Fallout's Avatar
    Join Date
    Aug 2003
    Location
    Richmond, Virginia
    Posts
    543
    Member #
    2748
    This kinda goes against the last part of your post, but a table that only has one cell is pretty much a <div> but with more code. Try this for the logo to center it:

    Code:
    #logo img { position: absolute; left: 50%; margin-left: -200px; width: 400px; }
    This code works for a 400px wide image, it centers it horizontally. To adjust the size, change the width part and make the margin-left half of the width. This doesn't make the <div> 100% wide, so it shouldn't cover up anything.

  4. #3
    Senior Member raspberryh's Avatar
    Join Date
    Aug 2004
    Location
    Erie, PA
    Posts
    882
    Member #
    7208
    Liked
    1 times
    oh wow, thanks a ton!!!!
    about the last part of my post, i meant about the layout of the entire site, i didn't mean for just the logo... i just meant how sometimes when you ask for advice, instead of giving you advice towards your specific problem, people are just like "Don't use tables, use CSS only" and then they don't even answer your question.
    anyways, thank you SO MUCH, you are awesome! I really appreciate your help!!!
    choosy developers choose gif!
    website | paintings | blog

  5. #4
    Senior Member raspberryh's Avatar
    Join Date
    Aug 2004
    Location
    Erie, PA
    Posts
    882
    Member #
    7208
    Liked
    1 times
    ps: i <3 php too
    choosy developers choose gif!
    website | paintings | blog

  6. #5
    Senior Member Rince's Avatar
    Join Date
    Nov 2004
    Posts
    183
    Member #
    8318
    margin-left: 200px;
    Didn't you mean margin-left: -200px; The - is required to shift the image back by half it's width.

    Here's a simpler method that doesn't involve absolute positioning.
    Code:
    <img src="somefile.gif" width=400 height=200 style="margin:auto;">
    Or for the whole site,
    Code:
    #wrapper{ width:750px; margin:auto;}
    
    <div id="wrapper">
    rest of site conent goes here
    </div>

  7. #6
    Senior Member Fallout's Avatar
    Join Date
    Aug 2003
    Location
    Richmond, Virginia
    Posts
    543
    Member #
    2748
    Rince, I did forget the negative, its a key part.


Remove Ads

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
All times are GMT -6. The time now is 04:36 PM.
Powered by vBulletin® Version 4.2.3
Copyright © 2019 vBulletin Solutions, Inc. All rights reserved.
vBulletin Skin By: PurevB.com