New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Bug with Table reflow on Safari #5380

Closed
agcolom opened this Issue Dec 15, 2012 · 10 comments

Comments

Projects
None yet
6 participants
@agcolom
Member

agcolom commented Dec 15, 2012

The table in this example does not display properly when the screen wide, then made narrow and then wide again http://jquerymobile.com/test/docs/tables/table-reflow.html

The effect is that the columns are not aligned properly, see picture 1.
tablereflow-bug1

Then, if you make the window narrow again and wide again, you get a different misalignement, and this continues each time you resize the table. see pictures 2 and 3
tablereflow-bug2
tablereflow-bug3

Only seems to happen with Safari (FF and Chrome are fine).
reproduce with Safari 5.1.7 on Mac OS X 10.6.8

@toddparker

This comment has been minimized.

Show comment
Hide comment
@toddparker

toddparker Dec 17, 2012

Contributor

I just tested that page on Safari 6.0.2 on Mountain Lion and can't reproduce it so it looks like Apple fixed this bug. Can you upgrade to a higher version on 10.6 or is that the max?

Contributor

toddparker commented Dec 17, 2012

I just tested that page on Safari 6.0.2 on Mountain Lion and can't reproduce it so it looks like Apple fixed this bug. Can you upgrade to a higher version on 10.6 or is that the max?

@vicoysito

This comment has been minimized.

Show comment
Hide comment
@vicoysito

vicoysito Dec 17, 2012

i have the same problem on chrome on android... some idea?

vicoysito commented Dec 17, 2012

i have the same problem on chrome on android... some idea?

@agcolom

This comment has been minimized.

Show comment
Hide comment
@agcolom

agcolom Dec 17, 2012

Member

just for the record, I cannot upgrade to a higher version of Safari on 10.6

Member

agcolom commented Dec 17, 2012

just for the record, I cannot upgrade to a higher version of Safari on 10.6

@vicoysito

This comment has been minimized.

Show comment
Hide comment
@vicoysito

vicoysito Dec 17, 2012

I could solve it by adding the following code in the header:

-----

<script> var htmlTemp = ""; $(document).ready(function() { $(window).bind("orientationchange", mainFunction); }); function mainFunction(){ if(window.orientation!=0 && htmlTemp ==""){ htmlTemp = $("#YOURTABLEID").html(); $("#YOURTABLEID").html(""); $("#YOURTABLEID").html(htmlTemp); htmlTemp =""; } } </script>

for some strange reason the table is not updated well and you must restart the content

hope will be of your help greetings

vicoysito commented Dec 17, 2012

I could solve it by adding the following code in the header:

-----

<script> var htmlTemp = ""; $(document).ready(function() { $(window).bind("orientationchange", mainFunction); }); function mainFunction(){ if(window.orientation!=0 && htmlTemp ==""){ htmlTemp = $("#YOURTABLEID").html(); $("#YOURTABLEID").html(""); $("#YOURTABLEID").html(htmlTemp); htmlTemp =""; } } </script>

for some strange reason the table is not updated well and you must restart the content

hope will be of your help greetings

@Wilto

This comment has been minimized.

Show comment
Hide comment
@Wilto

Wilto Jan 8, 2013

Contributor

This should be closed by bafa5d9.

@agcolom, mind double-checking? It’s a nonsense fix, so we’ll need to make sure no other browsers are impacted.

Contributor

Wilto commented Jan 8, 2013

This should be closed by bafa5d9.

@agcolom, mind double-checking? It’s a nonsense fix, so we’ll need to make sure no other browsers are impacted.

@agcolom

This comment has been minimized.

Show comment
Hide comment
@agcolom

agcolom Jan 9, 2013

Member

This issue is fixed on Safari 5.1.7 on Mac OS X 10.6.8

Member

agcolom commented Jan 9, 2013

This issue is fixed on Safari 5.1.7 on Mac OS X 10.6.8

@Wilto Wilto closed this Jan 9, 2013

@Wilto

This comment has been minimized.

Show comment
Hide comment
@Wilto

Wilto Jan 9, 2013

Contributor

Closed by bafa5d9

Contributor

Wilto commented Jan 9, 2013

Closed by bafa5d9

@jaspermdegroot

This comment has been minimized.

Show comment
Hide comment
@jaspermdegroot

jaspermdegroot Oct 9, 2013

Member

Has anybody tested this on iOS 5 Mobile Safari iPad 1?

Member

jaspermdegroot commented Oct 9, 2013

Has anybody tested this on iOS 5 Mobile Safari iPad 1?

@arschmitz

This comment has been minimized.

Show comment
Hide comment
@arschmitz

arschmitz Oct 11, 2013

Member

i will test this when i get home on monday on iPad iOS5 don't have it with me in DC

Member

arschmitz commented Oct 11, 2013

i will test this when i get home on monday on iPad iOS5 don't have it with me in DC

@jaspermdegroot

This comment has been minimized.

Show comment
Hide comment
@jaspermdegroot

jaspermdegroot May 12, 2014

Member

If I remove the .ui-table-reflow.ui-responsive { display: table-row-group; } fix (see #6584) I can reproduce the issue on Safari 5.1.7 / Windows 7.

Member

jaspermdegroot commented May 12, 2014

If I remove the .ui-table-reflow.ui-responsive { display: table-row-group; } fix (see #6584) I can reproduce the issue on Safari 5.1.7 / Windows 7.

gabrielschulhof added a commit that referenced this issue May 30, 2014

Table: remove reflow CSS hack for Safari <= 5
It causes problems with assistive technology not being able to detect tables.

This effectively reverts bafa5d9, thus
removing the fix for gh-5380.

Closes gh-6584
Fixes gh-6583
Re gh-5380

gabrielschulhof added a commit that referenced this issue May 30, 2014

Table: remove reflow CSS hack for Safari <= 5
It causes problems with assistive technology not being able to detect tables.

This effectively reverts bafa5d9, thus
removing the fix for gh-5380.

(cherry picked from commit 71c823e)

Closes gh-6584
Fixes gh-6583
Re gh-5380

agcolom added a commit to agcolom/jquery-mobile that referenced this issue Nov 26, 2014

Table: remove reflow CSS hack for Safari <= 5
It causes problems with assistive technology not being able to detect tables.

This effectively reverts bafa5d9, thus
removing the fix for gh-5380.

Closes gh-6584
Fixes gh-6583
Re gh-5380
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment