google / WebFundamentals

Former git repo for WebFundamentals on developers.google.com
Apache License 2.0
13.85k stars 2.57k forks source link

[CLOSED] Table heading display problem with smaller viewport width #231

Closed PaulKinlan closed 10 years ago

PaulKinlan commented 10 years ago

Issue by samdutton Monday Apr 28, 2014 at 12:40 GMT # Sample: Friday Sep 13, 2013 at 22:58 GMT Originally opened as https://github.com/PaulKinlan/WebDocs/issues/83


https://web-central.appspot.com/web/essentials/the-essentials/introduction-to-media/video:

image

PaulKinlan commented 10 years ago

Comment by peduarte Monday Apr 28, 2014 at 12:50 GMT # Sample: Friday Sep 13, 2013 at 22:58 GMT


Hello!

The reason this happens is because the Mobile Table Headers are created via pseudo elements.

I found this to be the best solution for responsive tables, but it means you need to add a data-th attribute on the td.

Please refer to the example on the styleguide: https://web-central.appspot.com/web/essentials/resources/styleguide/index.html#table

Thanks, Pedro

PaulKinlan commented 10 years ago

Comment by PaulKinlan Monday Apr 28, 2014 at 12:56 GMT # Sample: Friday Sep 13, 2013 at 22:58 GMT


sgtm. thanks. @samdutton can you update your doc and close this issue when done.