Web Analytics Made Easy -
StatCounter CSS layer - how to get it to hug the bottom - CodingForum

Announcement

Collapse
No announcement yet.

CSS layer - how to get it to hug the bottom

Collapse
X
 
  • Filter
  • Time
  • Show
Clear All
new posts

  • CSS layer - how to get it to hug the bottom

    Fairly simple I'd have thought but under closer inspection, perhaps not. Would be grateful if anybody could help out with it.

    Anyway, what I need to do is to get an image to stay in the bottom right. This is easy with absolute positioning but when you scroll down it remains in position. I can't specify it as a background image because I've already got one.

    The rest of the layout is relatively positioned but that probably doesn't make any difference.


    So to sum up, how can you get a layer to hug the bottom of the page even when you scroll down?



    Thanks in advance,
    Ed

  • #2
    Just set the absolute positioning to:
    Code:
    div.name{position:absolute; bottom:1px; right:1px;}
    ttttt
    http://openoffice.org/- Microsoft Office without the Microsoft.
    [home page][forum]
    Versatile, free software

    Comment


    • #3
      Same result as having bottom: 0px and right: 0px;

      Absolute positioning applies to the initial browser position but doesn't follow when you scroll.

      Comment


      • #4
        you want position:fixed;

        IE does not support this though.
        eak | "Doing a good deed is like wetting your pants; every one can see the results, but only you can feel the warmth."

        Comment


        • #5
          Can you post a link to your site?
          ttttt
          http://openoffice.org/- Microsoft Office without the Microsoft.
          [home page][forum]
          Versatile, free software

          Comment


          • #6
            Unfortunately not, I have to keep it confidential until it's released and IE support is important moreso than anything else so fixed isn't really an option. I guess I'll have to do without it for the time being. Thanks for the help.

            Comment


            • #7
              Hi,

              Try this:

              http://www.cssplay.co.uk/layouts/fixed.html

              ...and this:

              http://www.divinentd.com/experiments...ion-fixed.html

              Kind regards,

              Gary
              'cna ne1 plz giv cod'

              Comment


              • #8
                Have you thought about positioning the image as an image and set its z-index to 1 and set the z-index to the content text to 5. This should allow the text to flow over the image as if it were a background no problem!

                #YourPicture img {
                position:absolute;
                bottom:0;
                right:0;
                z-index:1;
                }

                #content {
                position:relative;
                z-index:5;
                }

                then put all you text in <div id=content>YourText</div>

                That should do the trick.

                Daniel

                Comment

                Working...
                X