Layout broken in IE9 and IE10

Hi Craig,

thanks for your post, and sorry for the trouble.

Can you please try again after unchecking the “Use DataTables” checkbox? As the individual features are turned off anyway, that’s not necessary and might interfere here.

Regards,
Tobias

Hi Tobias,
Just disabled them, but no change.

I’ve pulled out all of the custom CSS for that table.

Here’s a screenshot of it now in IE9 on Win7:
https://www.dropbox.com/s/xtth3igok2yfaq3/win7_ie_9.0.png?dl=0

This is much better, but what would you suggest for making the NAME and PHONE columns wider?

Thanks for your help!

UPDATE:

This is the best I can get it on IE9: https://www.dropbox.com/s/lbjuxcihz8jd6io/win7_ie_9.0-version2.png?dl=0

Removing the fixed-width table layout CSS seems to help, but I keep having problems with all browser versions accepting my column widths.

Here’s my current CSS

.tablepress-id-1 .column-1 {
	width: 15%;
}

.tablepress-id-1 .column-2 {
	width: 25%;
}

.tablepress-id-1 .column-3 {
	width: 25%;
}

.tablepress-id-1 .column-4 {
	width: 20%;
}

.tablepress-id-1 .column-5 {
	width: 15%;
}

My biggest problem now is column-4 needs to be wider. No matter what changes I make though, it’s like it’s being ignored.

Any suggestions?

Thanks!
Craig

Hi Craig,

thanks for testing this. I think I know what’s going on now. From what I can see, your theme is using some CSS that coincidentally uses the same CSS classes as TablePress does for the columns, and that slightly interferes. Thus, you’ll just have to increase the priority of your CSS for the column widths by adding the !important keyword, like

.tablepress-id-1 .column-1 {
	width: 20% !important;
}

Could you please try that for all columns?

Regards,
Tobias

Tobias,
You’re da man. That worked perfectly.

Thank you!
Craig

Hi,

no problem, you are very welcome! ?? Good to hear that this helped!

Best wishes,
Tobias

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