Skip to content
Permalink
Browse files
CSS: Rewrote .ui-helper-hidden-accessible base on HTML5 Boilerplate. …
…Fixes #4623 - CSS: ui-helper-hidden-accessible affects page layout.
  • Loading branch information
scottgonzalez committed Nov 22, 2010
1 parent d23fe49 commit a9d854967f0175b4c4b8a48c76a71d0fd1028680
Showing 1 changed file with 1 addition and 1 deletion.
@@ -11,7 +11,7 @@
/* Layout helpers
----------------------------------*/
.ui-helper-hidden { display: none; }
.ui-helper-hidden-accessible { position: absolute; left: -99999999px; }
.ui-helper-hidden-accessible { position: absolute !important; clip: rect(1px 1px 1px 1px); clip: rect(1px,1px,1px,1px); }
.ui-helper-reset { margin: 0; padding: 0; border: 0; outline: 0; line-height: 1.3; text-decoration: none; font-size: 100%; list-style: none; }
.ui-helper-clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
.ui-helper-clearfix { display: inline-block; }

7 comments on commit a9d8549

@jonathantneal
Copy link

@jonathantneal jonathantneal commented on a9d8549 Nov 22, 2010

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

If possible, don't include clip: rect(1px,1px,1px,1px);. The only reason people include both versions of clip is because version with commas is spec valid. However, some IEs can't read clip with commas, and every browser can read the one without commas, so what point is there to include the comma version if you're going invalidate your css with the commas-less version anyway? I say, take it out.

@scottgonzalez
Copy link
Member Author

@scottgonzalez scottgonzalez commented on a9d8549 Nov 22, 2010

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

It seems like removing the version with commas would prevent us from ensuring forward-compatibility.

@kflorence
Copy link
Contributor

@kflorence kflorence commented on a9d8549 Apr 2, 2011

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This is giving me issues in Firefox 3.6.16 in Ubuntu, specifically with the datepicker, which remains in an invisible state unless you apply "clip: auto" to the element.

@rdworth
Copy link
Contributor

@rdworth rdworth commented on a9d8549 Apr 4, 2011

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I was not able to reproduce any issue in Firefox 3.6.16 in Ubuntu 10.10 using http://view.jqueryui.com/master/demos/datepicker/default.html

@kflorence
Copy link
Contributor

@kflorence kflorence commented on a9d8549 Apr 4, 2011

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

That datepicker does not have the "ui-helper-hidden-accessible" class applied to it, which is the class causing the problem. I wonder why mine does...

@kflorence
Copy link
Contributor

@kflorence kflorence commented on a9d8549 Apr 4, 2011

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

a4d54b4#ui/jquery.ui.datepicker.js

That would be why. I guess I have a newer theme coupled with an older version of the datepicker. Thanks for your help.

@speedom8
Copy link

@speedom8 speedom8 commented on a9d8549 Nov 13, 2012

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The above fix worked for me. I have tested with the latest versions of Chrome, Firefox, Safari, and IE8
.ui-helper-hidden-accessible { position: absolute !important; clip: rect(1px 1px 1px 1px); clip: rect(1px,1px,1px,1px); }

Please sign in to comment.