Error causing code not to render on Ipads

Hi,

There is a problem when looking at the table (of pies) on the page mentioned, but only when looking using a normal ipad in landscape mode. I have created this table using TablePress (I have already put this question direct to the plugin’s (Tablepress) author and he does not know the answer. I think it may lie in the CSS rather than the plugin)

As you can see if you look at the page on a normal ipad in landscape mode the whole table appears to be pushed to the right, this is obvious when looking at the right-hand side on the blue bar (Beef & Onion). Could you let me know what is causing this?

If useful the CSS code that I am using is:

@media (max-width: 768px) {

	.tablepress-id-2 th {
	}

	.tablepress-id-2 .row-1 .column-2 {
		vertical-align: middle;
		text-align: center;
	}

	.tablepress-id-2 td {
		font-size: 10px;
		line-height: 13px;
	}

	.tablepress-id-2 img {
		min-width: 50px;
		max-width: 100%;
		vertical-align: middle;
	}

}

@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 1) {

	table.tablepress-id-2 {
		width: 400px;
		margin: 0 auto 1em;
	}

	.tablepress-id-2 .row-1 .column-1 {
		background-color: #33FFB2;
	}
}

.tablepress-id-2 .row-1 .column-2 {
	vertical-align: middle;
	text-align: center;
}

.tablepress-id-2 .row-1 .column-1 {
	background-color: #05affd;
}

.tablepress-id-2 .row-3 .column-2 {
	background-color: #05affd;
}

Has anybody else found this? It there a coding solution?

The problem can be seen here Ipad issue
Thanks

Paul

• This topic was modified 6 years ago by pbwpwork.
• This topic was modified 6 years ago by pbwpwork.

The page I need help with: [log in to see the link]