[phpBB Debug] PHP Warning: in file [ROOT]/includes/bbcode.php on line 483: preg_replace(): The /e modifier is no longer supported, use preg_replace_callback instead
[phpBB Debug] PHP Warning: in file [ROOT]/includes/bbcode.php on line 483: preg_replace(): The /e modifier is no longer supported, use preg_replace_callback instead
[phpBB Debug] PHP Warning: in file [ROOT]/includes/bbcode.php on line 483: preg_replace(): The /e modifier is no longer supported, use preg_replace_callback instead
[phpBB Debug] PHP Warning: in file [ROOT]/includes/bbcode.php on line 483: preg_replace(): The /e modifier is no longer supported, use preg_replace_callback instead
[phpBB Debug] PHP Warning: in file [ROOT]/includes/bbcode.php on line 483: preg_replace(): The /e modifier is no longer supported, use preg_replace_callback instead
[phpBB Debug] PHP Warning: in file [ROOT]/includes/bbcode.php on line 483: preg_replace(): The /e modifier is no longer supported, use preg_replace_callback instead
[phpBB Debug] PHP Warning: in file [ROOT]/includes/bbcode.php on line 483: preg_replace(): The /e modifier is no longer supported, use preg_replace_callback instead
[phpBB Debug] PHP Warning: in file [ROOT]/includes/bbcode.php on line 483: preg_replace(): The /e modifier is no longer supported, use preg_replace_callback instead
[phpBB Debug] PHP Warning: in file [ROOT]/includes/bbcode.php on line 483: preg_replace(): The /e modifier is no longer supported, use preg_replace_callback instead
[phpBB Debug] PHP Warning: in file [ROOT]/includes/bbcode.php on line 483: preg_replace(): The /e modifier is no longer supported, use preg_replace_callback instead
[phpBB Debug] PHP Warning: in file [ROOT]/includes/bbcode.php on line 483: preg_replace(): The /e modifier is no longer supported, use preg_replace_callback instead
[phpBB Debug] PHP Warning: in file [ROOT]/includes/bbcode.php on line 483: preg_replace(): The /e modifier is no longer supported, use preg_replace_callback instead
[phpBB Debug] PHP Warning: in file [ROOT]/includes/bbcode.php on line 483: preg_replace(): The /e modifier is no longer supported, use preg_replace_callback instead
[phpBB Debug] PHP Warning: in file [ROOT]/includes/bbcode.php on line 483: preg_replace(): The /e modifier is no longer supported, use preg_replace_callback instead
[phpBB Debug] PHP Warning: in file [ROOT]/includes/bbcode.php on line 483: preg_replace(): The /e modifier is no longer supported, use preg_replace_callback instead
[phpBB Debug] PHP Warning: in file [ROOT]/includes/bbcode.php on line 483: preg_replace(): The /e modifier is no longer supported, use preg_replace_callback instead
[phpBB Debug] PHP Warning: in file [ROOT]/includes/bbcode.php on line 483: preg_replace(): The /e modifier is no longer supported, use preg_replace_callback instead
[phpBB Debug] PHP Warning: in file [ROOT]/includes/bbcode.php on line 483: preg_replace(): The /e modifier is no longer supported, use preg_replace_callback instead
[phpBB Debug] PHP Warning: in file [ROOT]/includes/bbcode.php on line 483: preg_replace(): The /e modifier is no longer supported, use preg_replace_callback instead
[phpBB Debug] PHP Warning: in file [ROOT]/includes/bbcode.php on line 483: preg_replace(): The /e modifier is no longer supported, use preg_replace_callback instead
[phpBB Debug] PHP Warning: in file [ROOT]/includes/bbcode.php on line 483: preg_replace(): The /e modifier is no longer supported, use preg_replace_callback instead
[phpBB Debug] PHP Warning: in file [ROOT]/includes/bbcode.php on line 483: preg_replace(): The /e modifier is no longer supported, use preg_replace_callback instead
[phpBB Debug] PHP Warning: in file [ROOT]/includes/bbcode.php on line 483: preg_replace(): The /e modifier is no longer supported, use preg_replace_callback instead
[phpBB Debug] PHP Warning: in file [ROOT]/includes/bbcode.php on line 483: preg_replace(): The /e modifier is no longer supported, use preg_replace_callback instead
[phpBB Debug] PHP Warning: in file [ROOT]/includes/bbcode.php on line 483: preg_replace(): The /e modifier is no longer supported, use preg_replace_callback instead
[phpBB Debug] PHP Warning: in file [ROOT]/includes/bbcode.php on line 483: preg_replace(): The /e modifier is no longer supported, use preg_replace_callback instead
[phpBB Debug] PHP Warning: in file [ROOT]/includes/bbcode.php on line 483: preg_replace(): The /e modifier is no longer supported, use preg_replace_callback instead
[phpBB Debug] PHP Warning: in file [ROOT]/includes/bbcode.php on line 483: preg_replace(): The /e modifier is no longer supported, use preg_replace_callback instead
[phpBB Debug] PHP Warning: in file [ROOT]/includes/bbcode.php on line 483: preg_replace(): The /e modifier is no longer supported, use preg_replace_callback instead
[phpBB Debug] PHP Warning: in file [ROOT]/includes/bbcode.php on line 483: preg_replace(): The /e modifier is no longer supported, use preg_replace_callback instead
[phpBB Debug] PHP Warning: in file [ROOT]/includes/bbcode.php on line 483: preg_replace(): The /e modifier is no longer supported, use preg_replace_callback instead
[phpBB Debug] PHP Warning: in file [ROOT]/includes/bbcode.php on line 483: preg_replace(): The /e modifier is no longer supported, use preg_replace_callback instead
[phpBB Debug] PHP Warning: in file [ROOT]/includes/bbcode.php on line 483: preg_replace(): The /e modifier is no longer supported, use preg_replace_callback instead
[phpBB Debug] PHP Warning: in file [ROOT]/includes/bbcode.php on line 483: preg_replace(): The /e modifier is no longer supported, use preg_replace_callback instead
[phpBB Debug] PHP Warning: in file [ROOT]/includes/bbcode.php on line 483: preg_replace(): The /e modifier is no longer supported, use preg_replace_callback instead
[phpBB Debug] PHP Warning: in file [ROOT]/includes/bbcode.php on line 483: preg_replace(): The /e modifier is no longer supported, use preg_replace_callback instead
[phpBB Debug] PHP Warning: in file [ROOT]/includes/bbcode.php on line 483: preg_replace(): The /e modifier is no longer supported, use preg_replace_callback instead
[phpBB Debug] PHP Warning: in file [ROOT]/includes/bbcode.php on line 483: preg_replace(): The /e modifier is no longer supported, use preg_replace_callback instead
[phpBB Debug] PHP Warning: in file [ROOT]/includes/bbcode.php on line 483: preg_replace(): The /e modifier is no longer supported, use preg_replace_callback instead
[phpBB Debug] PHP Warning: in file [ROOT]/includes/bbcode.php on line 483: preg_replace(): The /e modifier is no longer supported, use preg_replace_callback instead
[phpBB Debug] PHP Warning: in file [ROOT]/includes/bbcode.php on line 483: preg_replace(): The /e modifier is no longer supported, use preg_replace_callback instead
[phpBB Debug] PHP Warning: in file [ROOT]/includes/bbcode.php on line 483: preg_replace(): The /e modifier is no longer supported, use preg_replace_callback instead
[phpBB Debug] PHP Warning: in file [ROOT]/includes/bbcode.php on line 483: preg_replace(): The /e modifier is no longer supported, use preg_replace_callback instead
[phpBB Debug] PHP Warning: in file [ROOT]/includes/bbcode.php on line 483: preg_replace(): The /e modifier is no longer supported, use preg_replace_callback instead
[phpBB Debug] PHP Warning: in file [ROOT]/includes/bbcode.php on line 483: preg_replace(): The /e modifier is no longer supported, use preg_replace_callback instead
[phpBB Debug] PHP Warning: in file [ROOT]/includes/bbcode.php on line 483: preg_replace(): The /e modifier is no longer supported, use preg_replace_callback instead
[phpBB Debug] PHP Warning: in file [ROOT]/includes/bbcode.php on line 483: preg_replace(): The /e modifier is no longer supported, use preg_replace_callback instead
[phpBB Debug] PHP Warning: in file [ROOT]/includes/bbcode.php on line 483: preg_replace(): The /e modifier is no longer supported, use preg_replace_callback instead
[phpBB Debug] PHP Warning: in file [ROOT]/includes/bbcode.php on line 483: preg_replace(): The /e modifier is no longer supported, use preg_replace_callback instead
[phpBB Debug] PHP Warning: in file [ROOT]/includes/bbcode.php on line 483: preg_replace(): The /e modifier is no longer supported, use preg_replace_callback instead
[phpBB Debug] PHP Warning: in file [ROOT]/includes/bbcode.php on line 483: preg_replace(): The /e modifier is no longer supported, use preg_replace_callback instead
[phpBB Debug] PHP Warning: in file [ROOT]/includes/bbcode.php on line 483: preg_replace(): The /e modifier is no longer supported, use preg_replace_callback instead
[phpBB Debug] PHP Warning: in file [ROOT]/includes/functions.php on line 4752: Cannot modify header information - headers already sent by (output started at [ROOT]/includes/functions.php:3887)
[phpBB Debug] PHP Warning: in file [ROOT]/includes/functions.php on line 4754: Cannot modify header information - headers already sent by (output started at [ROOT]/includes/functions.php:3887)
[phpBB Debug] PHP Warning: in file [ROOT]/includes/functions.php on line 4755: Cannot modify header information - headers already sent by (output started at [ROOT]/includes/functions.php:3887)
[phpBB Debug] PHP Warning: in file [ROOT]/includes/functions.php on line 4756: Cannot modify header information - headers already sent by (output started at [ROOT]/includes/functions.php:3887)
CSS3 PIE Forums - View topic - PIE elements move when other elements added to page?
Forums
View unanswered posts | View active topics It is currently Fri Sep 18, 2020 11:34 pm



Reply to topic  [ 9 posts ] 
 PIE elements move when other elements added to page? 
Author Message

Joined: Mon Feb 07, 2011 12:27 pm
Posts: 6
Post PIE elements move when other elements added to page?
Thanks so much for this, CSS3PIE is awesome!
I have implemented it on a few different pages in my sites, but I am starting to see some strange behavior that I dont understand. I am using the border-radius and box-shadow to create a page header. The page has a few different ajax enabled controls which will add content to the page. When the page is scrolled all the way to the top, everything works fine, new content is added correctly. When the page is scrolled down a bit but the header is visible, when the new content gets added to the page, the PIE header moves up the page. Since the PIE element is visible, I can see it move, I scroll up to look at it, and when the mouse gets to the place on the screen where the header is supposed to be, it jumps back in place!

Also, if the header is in the right place and I scroll way down the page where the header is off-screen completely, click on some background or something that does not have a click handler attached, and then scroll back up the header is missing completely until I hover it with the mouse.

I hope I am just not setting something right, and can fix this with the right settings. Has anyone experienced this? Got any ideas for me?


Thu Feb 24, 2011 5:45 pm
Profile

Joined: Mon Feb 07, 2011 12:27 pm
Posts: 6
Post Re: PIE elements move when other elements added to page?
I wanted to note that the PIE'd elements only change position when the page is scrolled from the top and the height of the page changes. I have an asp:treeview on the page and when I expand treenodes (whether I am auto-populating or not) I see the PIE'd elements move on the page. But only if the page is NOT scrolled all the way to the top.
I have 2 PIE'd elements on the page, both make use of a border radius and a box shadow. When the page is scrolled from the top and THEN the page height is changed by showing different content, the page header changes position and the main content div no longer contains all of the page elements.
Hard to explain, but here's a temporary page showing the problem.. we are in the process of a redesign right now, and I hope we can continue implementing CSS3PIE.
newsitedesign [dot] culpepper [dot] com/Info2/ListJobs.aspx?SID=420

I need some ideas to get this working, or I will have to abandon it to keep moving forward..
Thanks in advance.


Fri Feb 25, 2011 9:56 am
Profile

Joined: Mon Feb 07, 2011 12:27 pm
Posts: 6
Post Re: PIE elements move when other elements added to page?
Sorry I keep replying on my own post, but I just realized that this has more to do with the page's scroll position than with the page size. If you scroll the page slightly and then hover the page header, it moves up. If you then scroll the page back to the top, and hover where the page header should be, it moved back in place. Also, the distance that the PIE'd element moves up the page is proportional to how far the page is scrolled down: the further the page is scrolled, the further up the page the header moves.
I'm seeing this behavior on Win7, IE8, and also on WinXP, IE6.


Fri Feb 25, 2011 10:22 am
Profile

Joined: Wed Jul 14, 2010 11:46 am
Posts: 1452
Post Re: PIE elements move when other elements added to page?
My guess is that this is because you're using tables for layout (it's very rare to see this, most people trying to use CSS3 have long since abandoned table layouts!) and there must be some bug in PIE with positioning on tables. Can you try adding a true semantic h1/h2/whatever header element and applying PIE to it instead?


Fri Feb 25, 2011 10:55 am
Profile

Joined: Mon Feb 07, 2011 12:27 pm
Posts: 6
Post Re: PIE elements move when other elements added to page?
I do understand the argument against tables.. I have tried a few times in the past to pull them out and do layout/positioning with pure css, and I have always run into problems getting the layout to look good, and look the same on all browsers when that goal is easily achieved using tables. I'll admit that presentation/UI is not my strong suit, but that is the task I am working on right now.. :(

I was able to get the header to stop moving around the page by applying position:relative to the containing table, so that is good news (at least maybe I've ruled out a bug :) ). However, the other problem still exists where the main content area doesnt grow to contain all of the page content if the page size changes after the page is scrolled from the top.
B/c this is similar to the issue that I was having above, I figured that I could add position:relative to the body or add a wrapping div to the page with position:relative.. but those options give me differing results the same or worse than before.

Is there something else I could try?


Fri Feb 25, 2011 11:26 am
Profile

Joined: Wed Mar 02, 2011 1:09 pm
Posts: 2
Post Re: PIE elements move when other elements added to page?
Hi,

Was this ever resolved?

I think I have a similar issue where I am using an ASP GridView, this renders as a table in the plain HTML. I use a button in the first column, but when I scroll my DIV (hidden: auto;) the button becomes mis-aligned with the button text.

I have attached a small screen shot of before and after.

Hopefully someone has seen something like this before.

Thanks in advance,

KingNugget


Attachments:
File comment: Before and after scrolling example
PIE Issue.jpg [31.28 KiB]
Downloaded 228 times
Wed Mar 02, 2011 1:42 pm
Profile

Joined: Mon Feb 07, 2011 12:27 pm
Posts: 6
Post Re: PIE elements move when other elements added to page?
Yes, I was finally able to get the right combination of settings for the PIE behaviors to work right and stay in place for me.
what finally worked for me was a combination of these items:

1) have to use the right doctype.. I tried 3 or 4 and had success with <!DOCTYPE HTML>, but ultimately due to other problems on the page, had to go with <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" />

2) have to put position:relative on the table. this is needed whether the style is on the table, or on table cells


It took a lot of trial and error, but this finally got me what I was looking for.
Gotta say thanks again, Jason for this awesome script!


Wed Mar 02, 2011 1:58 pm
Profile

Joined: Wed Mar 02, 2011 1:09 pm
Posts: 2
Post Re: PIE elements move when other elements added to page?
Thanks Stephen,

I'll have a look at those suggestions.


Wed Mar 02, 2011 2:33 pm
Profile

Joined: Fri Jun 03, 2011 4:34 pm
Posts: 2
Post Re: PIE elements move when other elements added to page?
I took a look into PIE and made a fix that should fix the scrolling tables issue. You can see my post here: viewtopic.php?f=4&t=1008


Fri Jun 03, 2011 4:44 pm
Profile
Display posts from previous:  Sort by  
Reply to topic   [ 9 posts ] 

Who is online

Users browsing this forum: Google [Bot] and 8 guests


You cannot post new topics in this forum
You cannot reply to topics in this forum
You cannot edit your posts in this forum
You cannot delete your posts in this forum
You cannot post attachments in this forum

Search for:
Jump to:  
cron
Powered by phpBB © 2000, 2002, 2005, 2007 phpBB Group.
Designed by STSoftware for PTF.