WORLD13

I am running 2.1.0 and the issue persists.

Hi….just wanted to follow up on this. Are there any plans to restore this functionality? Many thanks.

Would love an answer to this as well…

Hi Tobias,

Sorry to bother you again, but I noticed that the tables are not responsive in IE 9 (haven’t had a chance to test with other versions). Is there anything that can be done about that?

Thanks.

Hi Tobias,

Yes, you are right, it definitely looks good (I was looking at a different table)! I modified the code so that it applies to all tables and thing are looking good now. I really appreciate you taking the time to help us with this.

Cheers!

Sorry about that, Tobias. The site should be accessible again if you want to take a look.

Thanks Tobias. That fixed the search field, but the columns are still too wide to be properly displayed on a phone. Do you have any additional suggestions?

Hi Tobias,

I really appreciate you taking the time to help us out with this. I followed your instructions, but I am afraid the issue persists. The headers still occupy all of the horizontal space available (they expand up to 460px wide), making it impossible to scroll horizontally.

With the new CSS, the “search text” is also floated to the right, being covered by the search box. Take a look at the link that I posted before.

The only CSS rules that I added, in addition to the ones you suggested above, are these:

.tablepress thead th,
.tablepress tfoot th {
	background-color: #EDF2F7;
}

.tablepress thead .sorting_asc,
.tablepress thead .sorting_desc,
.tablepress thead .sorting:hover {
	background-color: #4679B2;
}

.paginate_enabled_previous:before,
.paginate_enabled_next:after {
	color: #EDF2F7;
}

.paginate_disabled_previous:before,
.paginate_disabled_next:after {
	color: #F9F9F9;
}

.paginate_enabled_previous:hover:before,
.paginate_enabled_next:hover:after {
	color: #4679B2;
}

.column-filter-widget {
	float: none;
	padding: 5px;
	max-width: 766px;
}

What else could it be?

Thanks, Tobias. You can see an example here: https://worldpolicyforum.org/tables/financial-assistance-available-per-month-low-income-families-children-disabilities/

Still trying to figure this out, so any input would be appreciated.

As a possible workaround, is there a way to add conditional rules for this kind of thing? i.e. if the sidebar is not displayed, then do not apply the styling above?

Anyone?

Just a follow up…I think I figured out what was causing the issue with the empty space below the content (seems to be a problem with the per-page sidebars plugin that I am using).

However, I still do not know how to make the content appear centered in pages without a sidebar, so if anyone has any pointers I would be most grateful.

Thank you, Tobias!

@esmi Thank you. I already created a child theme. Since this is really a follow up I thought it would be appropriate to post here.

Thanks, Jean-Baptiste. Do you know what need to be done in order to also shift the caption that appears when you conduct a search? I managed to center it with CSS, but it only looks good when the website is displayed on a screen at least 1000px wide; on a mobile phone, the text gets shifted to the right. here’s what I have:

.page-header {
background-color: #FFFFFF;
}

.page-title {

padding: 0 15px 0 270px;
margin-top: 20px;
}

Any feedback would be appreciated.