I built this http://www.culinariafoodandwine.com/contact_copy.html using techniques from right here at CSS-Tricks! It works great with the exception of implementing a form in a modal box. I’m using Colorbox http://colorpowered.com/colorbox/ and MachForm http://www.appnitro.com/ (which is ALOT like Wufoo, which exhibited the same behavior).
The problem is when you submit a form that is improperly filled out the Colorbox/form refreshes roughly 35px vertically out of the browser! WTF? :o
[img]http://img.skitch.com/20100513-nr824ieyq1xtug4bk35pnx1kfr.preview.jpg[/img]Click for full size
[img]http://img.skitch.com/20100513-biif3cby3gq3qu6x12kn5e43pp.preview.jpg[/img]Click for full size
I’m tried every CSS thing I can think of! Help?
I offered the boys at SitePoint $25 if you can be the first to solve this magical quandary. So I’ll offer it here as well..please help!
Here it is jumping with Colorbox: http://www.culinariafoodandwine.com/contact_copy.html
And here it is jumping with Fancybox: http://www.culinariafoodandwine.com/contact.html
Only seems to be a Firefox issue…
$25 people! Do it!
Hmm, http://www.culinariafoodandwine.com/contact_copy.html works fine for me in Firefox 3.6.3
What browser/version are you using?
That’s cuz I fixed it!
The solution centered around Safari vs. Firefox’s interpretation of position:absolute vs. position:fixed.
Via Paul O’B @ Sitepoint:
The jump seems to be where the document tries to scroll to the highlighted item via the fragment identifier.
You could try and set the box to position:fixed and then the scroll would be inside the box.
You must be logged in to reply to this topic.
*May or may not contain any actual "CSS" or "Tricks".