SitePoint Sponsor

User Tag List

Results 1 to 2 of 2
  1. #1
    SitePoint Wizard bronze trophy PicnicTutorials's Avatar
    Join Date
    Dec 2007
    Location
    Carlsbad, California, United States
    Posts
    3,658
    Mentioned
    15 Post(s)
    Tagged
    0 Thread(s)

    Intersting finding.

    Just found that if you have a fixed item in a wrapper with overflow hidden and you jquery animate the item from the right side to the left - wash and repeat - in iPhone and Opera they both honor the overflow hidden on the wrapper and hide it from there. The others overflow hidden it from the body. Fixed items are supposed to be positioned from the body so the later behavior is "probably" correct - I'm not certain that's a toss up? The easy fix is obviously to take the item out of the wrapper.

  2. #2
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    40,389
    Mentioned
    180 Post(s)
    Tagged
    6 Thread(s)
    Quote Originally Posted by EricWatson View Post
    Fixed items are supposed to be positioned from the body so the later behavior is "probably" correct.
    Yes, the overflow:hidden on the parent should have no effect on the fixed positioned element as the body element is the stacking context for fixed positioned elements. All modern browsers seem to get it right with a simple css example.
    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>Untitled Document</title>
    <style type="text/css">
    div {
    	margin:50px;
    	background:red;
    	width:200px;
    	height:100px;
    	overflow:hidden;
    	position:relative;
    }
    p {
    	margin:100px 0 0;
    	position:fixed;
    }
    </style>
    </head>
    
    <body>
    <div>
    		<p>testing</p>
    </div>
    </body>
    </html>


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
  •