www.webdeveloper.com
Results 1 to 5 of 5

Thread: DIV Fixed to Top of Screen

  1. #1
    Join Date
    Aug 2008
    Location
    London, UK
    Posts
    49

    DIV Fixed to Top of Screen

    I have a DIV element which I want to remain at the top of the screen, even if the user scrolls down. I've done everything I think, but it still does not seem to be working.

    Here is an example of my current setup:
    Example

  2. #2
    Join Date
    Dec 2005
    Posts
    2,984
    CSS:
    Code:
    position: fixed;
    width: 100%;
    I've switched careers...
    I'm NO LONGER a scientist,
    but now a web developer...
    awesome.

  3. #3
    Join Date
    Aug 2008
    Location
    London, UK
    Posts
    49
    Quote Originally Posted by aj_nsc View Post
    CSS:
    Code:
    position: fixed;
    width: 100%;
    Already using that in the CSS file.

  4. #4
    Join Date
    Dec 2005
    Posts
    2,984
    @import is pointing to the wrong directory.....so it doesn't look like you are using it in your CSS.

    I right clicked the element and clicked "Inspect element" in webkit and checked out all the applied styles, position: fixed wasn't one of them meaning that the styles in nav.css weren't getting applied.

    That's why I missed it.

    Should be @import(nav.css) - it points relative to the CSS file, not the HTML document that the CSS file is linked to.
    Last edited by aj_nsc; 07-03-2011 at 07:38 AM.
    I've switched careers...
    I'm NO LONGER a scientist,
    but now a web developer...
    awesome.

  5. #5
    Join Date
    Aug 2008
    Location
    London, UK
    Posts
    49
    Quote Originally Posted by aj_nsc View Post
    Missed your @import statement...
    Thank you so much, I had a slight typo in the ID section.

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Tags for this Thread

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles