dotMobimobiThinkingmobiForgemobiReadyDeviceAtlasgoMobi

Fixit - Tables for layout

Section Feature image
Posted by ruadhan 4 years 16 weeks ago
Bookmark and Share

This test attempts to determines if your page is using tables for layout purposes. Tables should be used to present tabular data, rather than to control the layout of a page. The problems associated with using tables for layout are well documented. In particular, they generally require more markup and take longer to render than acheiving the same with CSS. In addition, most devices cannot display nested tables correctly either. (Ready.mobi also checks for nested tables)

 

Checking if tables are used for layout

To pass this test your page should follow the following guidelines:

  • Each table element should contain more than one tr element
  • There should be at least one tr element that contains at least two td elements
  • No nested td element should contain ONLY an image or object whose dimensions are 2x2 or less.

 

Reference

This test is based on a W3C mobileOK best practice. See http://www.w3.org/TR/mobile-bp/#TABLES_LAYOUT for more details.

See also the Nested tables and the Tables tests.

 

Still confused? Get help at the forum.

 


Posted by ruadhan 4 years 16 weeks ago

ruadhan's picture

Mobile guy at dotMobi

@rodono

Posted by kyazdani 3 years ago

Hi there,

Is there a reason why you have to have two rows within a table and not just one with two columns?

Kaz Yaz

Posted by ruadhan 3 years ago

kyazdani wrote:

Is there a reason why you have to have two rows within a table and not just one with two columns?

If your table only has one row, is there any advantage to using a table? Wouldn't the data be better displayed as a list?

Ruadhan O'Donoghue
dotMobi

Posted by kyazdani 3 years ago

The reason I would use a table with one tr component would be so that I could display two links side by side aligned centraly both with 50% widths. It mentions at the top you can achieve the same using CSS do you know how I could achieve this without an error?

Kaz Yaz

Posted by bsnower 2 years ago

I'm trying to create a simple data entry form page for mobile - 6 rows, 2 columns.. Any suggestions as to how I should build this to make it display best? Looks fine on BBerry Curve & iPhone using tables.. switched to divs & CSS and looks fine on iPhone, not so good on Curve.. Would appreciate help/suggestions. Thank you.

Posted by gtradial 21 weeks ago

thanks... Keep up the good work....

Pekanbaru | Ban Terbaik di Indonesia GT Radial

Posted by gtradial 21 weeks ago

I am quite sure they will learn lots of new stuff here than anybody else!

Pekanbaru | Ban Terbaik di Indonesia GT Radial