Results 1 to 4 of 4

Thread: How to make a logo visible at all times with no need for scrolling

  1. #1
    Join Date
    Apr 2008
    Posts
    109
    Thanks
    7
    Thanked 0 Times in 0 Posts

    Default How to make a logo visible at all times with no need for scrolling

    Hey!

    Alright, so I wasn't sure whether to post this here on the PHP boards, or use the HTML or CSS boards instead, but here's the thing.

    I'm looking to build my new website from scratch, and I have this idea in my head that I can't let go.

    Instead of the logo at the top, I want the logo placed in the 'footer' (bottom) of each page.

    However, the logo should be visible at all times, so that you don't have to scroll to the bottom to see it.

    An example could be the bottom pane used on Facebook. Facebook's got a small grey pane at the bottom with application tools, etc.

    Is it easily possible for me to reach some sort of reasonable solution to address this idea? For example, by using an iFrame of sorts, or something else?

    Perhaps it may be controlled entirely by CSS alone, or will it need to be scripted?

    Also, would possible solutions potentially cause any cross-browser issues and problems?

    I've no idea where to even begin here, so I thought that perhaps somebody here on the Dynamic Drive forums might be able to shed some light on this for me... and others, obviously, and point me in the right direction.

    PS: Perhaps I should state that I am considering using WordPress to create my new website.

    Thanks for your help!


    Cheers,
    Bassa
    Last edited by Snookerman; 04-27-2009 at 09:10 PM. Reason: added “Resolved” prefix

  2. #2
    Join Date
    Oct 2008
    Location
    Sweden
    Posts
    2,023
    Thanks
    17
    Thanked 319 Times in 318 Posts
    Blog Entries
    3

    Default

    Yes, this is possible with CSS only (I'll move the thread to the CSS forum for you). You could put the logo in a container (with the class of logo in this example; you could just as well just use the image without the container if you want though) and give it the following CSS rules:
    Code:
    div.logo {
    bottom: 0;
    position: fixed;
    }
    That should work in all popular browsers except IE6 (which is strangely enough still popular among some audiences). If you want this to work in IE6 as well, you will need to do a bit more work, this article shows you how:
    http://ryanfait.com/resources/fixed-positioning-in-internet-explorer/

    Good luck!
    Eddy Proca
    I love Dropbox. Get it through my girlfriend's referral link (I reached my limit) and both you and her get 500 MB extra! Thanks and you're welcome!

  3. #3
    Join Date
    Apr 2008
    Posts
    109
    Thanks
    7
    Thanked 0 Times in 0 Posts

    Default

    Don't you just love it when you sometimes stumble upon something so unbelievably fascinating that you think; "Wow! This stuff is brilliant, but I betcha it's gonna give me headaches finding the right workaround for doing it..."?

    And then someone swaggers along, and places the simplest solution right in front of your eyes, and you go "/Facepalm!", and just can't stop friggin' smiling from here on out!

    Cheers, Snooker! And thanks!


    Cheers,
    Bassa

  4. #4
    Join Date
    Oct 2008
    Location
    Sweden
    Posts
    2,023
    Thanks
    17
    Thanked 319 Times in 318 Posts
    Blog Entries
    3

    Default

    You're welcome Bassa, I'm glad my answer evoked such feelings in you

    Good luck with your “footer logo”!
    Eddy Proca
    I love Dropbox. Get it through my girlfriend's referral link (I reached my limit) and both you and her get 500 MB extra! Thanks and you're welcome!

Tags for this Thread

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
  •