Is it possible to do this….

Hi,

nice works! Looks really good and the CSS is also fine.
If you want, you could now also turn off the “Info:” checkbox on the table’s “Edit” screen, to get rid of the “Showing 1 to 100 of 100 entries” text below the table.

Best wishes,
Tobias

P.S.: In case you haven’t, please rate TablePress here in the plugin directory. Thanks!

Haha. We posted at the same time ??

What I wanted to ask was ->

The Tables look perfect in Google Chrome, but they are all Misaligned in Firefox.

In Firefox, the second table is not the same height as the first table, and tiers do not match.

How do they look to you? And is there a way to make then universally aligned across all browsers and screens?

Thanks.

Hi,

oh. Yeah, I missed that as we posted at the same time, sorry.

Now, that’s strange, and I’m not sure why this is happening. I can only assume that the algorithms for calculations and setting the height of table rows differ between Chrome and Firefox.

Could you maybe also try setting the row height for the first table as well? By setting them, we can maybe prevent the browsers from doing their on calculations.

You could then also try to set the heights not directly for the rows, but for the cells, with

.tablepress-id-2 .row-3 td {
	height: 640px;
}

(note the extra td), if it doesn’t work without.

Regards,
Tobias

Thanks, I’ll experiment with that and get back to you. Thanks again!

GOT IT !!

I had to remove the padding and define the row height for the body and header of both tables. (or I think I did) ??

This is the CCS if anyone is interested.

.table-wrapper {
	margin: 0 auto;
	width: 600px;
}

#tablepress-1_wrapper {
	width: 33%;
	float: left;
	margin-left: 40px;
}

#tablepress-1_filter {
	display: none;
}

.tablepress-id-1 .column-1 {
	text-align: center;
}

.tablepress-id-1 tr {
	height: 37px;
}

.tablepress-id-1 thead th,
.tablepress-id-1 tbody td {
	border: 1px solid #333333;
}

.tablepress-id-1 thead th,
.tablepress-id-2 thead th {
	text-align: center;
	height: 30px;
}

.tablepress-id-2 {
	width: 55%;
}

/* each line is 37px in height */
.tablepress-id-2 .row-2 {
	height: 370px;
}

.tablepress-id-2 .row-3 {
	height: 1110px;
}

.tablepress-id-2 .row-4 {
	height: 1110px;
}

.tablepress-id-2 .row-5 {
	height: 1110px;
}

.tablepress-id-2 thead th,
.tablepress-id-2 tbody td {
	border: 1px solid #333333;
}

.tablepress-id-2 thead th:first-child,
.tablepress-id-2 tbody td:first-child {
	border-left: none;
}

Thanks Tobias!

Hi,

very nice! Great to hear that everything’s working now!

Best wishes,
Tobias

P.S.: In case you haven’t, please rate TablePress here in the plugin directory. Thanks!