SitePoint Sponsor

User Tag List

Results 1 to 6 of 6

Hybrid View

  1. #1
    SitePoint Addict
    Join Date
    Jan 2001
    Location
    Ottawa ON
    Posts
    315
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    position:absolute;top:100%;position:relative;top:-20px;


    #bar_bottom {position:absolute;top:100%;background-color:blue;}


    That is the code that I currently have on my page. It takes bar_bottom (which is a div tag that spreads across the entire page) and puts it at the bottom of the page. However, it puts that tag *just* below the bottom of the page so that there will always be a scroll bar. I want to move this object up about 20px.

    How would I do both of the following:
    position:absolute;top:100%;
    position:relative;top:-20px;

    to one element? I want to move it down 100% from the top of the page, and I also want the object to be 20px higher than it normally would be.

    The example (only works in IE5) is at http://rideau.prowsej.com/RHS0.4/main/

    Please see the bar on that page at the extreme bottom of the window.

    Edit: Sometimes I don't notice that I've copied the URL and it contains localhost instead of the domain
    Last edited by prowsej; Jun 9, 2001 at 17:24.

  2. #2
    Victory shall be mine tubedogg's Avatar
    Join Date
    Mar 2001
    Location
    Medina, OH
    Posts
    440
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hint: We can't see your localhost.
    Kevin

  3. #3
    SitePoint Member
    Join Date
    Jul 2001
    Posts
    11
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I get the effect I think you're looking for by putting an empty "spacer" DIV tag 20 pixels below the last element on my pages. Note: this is better than using the height property on the DIV tag, because Netscape doesn't support height yet.

    Huntress
    Last edited by Huntress; Jul 1, 2001 at 20:09.

  4. #4
    SitePoint Wizard creole's Avatar
    Join Date
    Oct 2000
    Location
    Nashvegas Baby!
    Posts
    7,845
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    top: 99%
    Adobe Certified Coldfusion MX 7 Developer
    Adobe Certified Advanced Coldfusion MX Developer
    My Blog (new) | My Family | My Freelance | My Recipes

  5. #5
    SitePoint Addict
    Join Date
    Jan 2001
    Location
    Ottawa ON
    Posts
    315
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    thanks for all of the responses

    My server is temporairly down, so you can't check my page (just found out that rogers@home doesn't allow users to run servers!)

    In the end I just decided that the aesthetics of the situation weren't worth the only solution that I was able to come up with.

    top:99% wouldn't work because it's not scalable enough (at work I know people who run with resolutions of >2000px!)

    Your idea for a spacer is what I was going to go with. My plan was to use javascript to detect if there was a scrollbar present in the window. If so, I would position the element normally (let it flow with the text). If there was no scrollbar, I would use CSS to absolutely position the bar at the bottom of the window with bottom:0px

    In the end, I should emphasise, I decided to drop this script because not enough browsers supported the javascript and CSS used (once supporting browsers comprise 75% of my audience then I'll consider is safe to employ.)

  6. #6
    SitePoint Enthusiast
    Join Date
    Mar 2001
    Location
    Madison, Wisconsin
    Posts
    42
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Well, this may be a little late, but what if you went top:99% and then added

    body {
    border-bottom: 1% solid #color_of_your_div;
    }


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
  •