Tablepress Search Box Text Alignment and Styling

  • Resolved itsnathanham

    (@itsnathanham)


    3 years, 8 months ago

    Within tablepress, I’d like to:

    -Adjust the vertical alignment of the “Search:” text to the bottom of the search box.
    -Apply a custom color to the border surrounding the search entry.

    I know where to enter the styling and how to apply it globally and/or to a single table. I just don’t know the CSS to achieve the intended outcome.

    • This topic was modified 3 years, 8 months ago by itsnathanham.
Viewing 3 replies - 1 through 3 (of 3 total)
  • Plugin Author Tobias Bäthge

    (@tobiasbg)

    3 years, 8 months ago

    Hi,

    thanks for your email, and sorry for the trouble.

    This again depends on your theme a bit, just as the pagination dropdown. Can you please post a link to the page with the table where this problem happens, so that I can take a direct look? Thanks!

    Regards,
    Tobias

    Thread Starter itsnathanham

    (@itsnathanham)

    3 years, 7 months ago

    Hi Tobias, Thanks for the quick reply. Apologies for the delayed reply — I just recently published the piece referenced and can now share the link. Here it is.

    https://www.setup.gg/game/warzone/pro-settings/

    In addition to the above question, is there a way to have just “Show” and the number box display when adding pagination and displaying the dropdown to filter the number of rows? Essentially this would change it from “Show [box] entries” to just “Show [box]”.

    I’ll follow up in some separate threads about some other questions I have for this table as it’s not formatting well right now with my theme and the number of columns.

    Plugin Author Tobias Bäthge

    (@tobiasbg)

    3 years, 7 months ago

    Hi,

    thanks for the link!

    For the original questions of this thread:

    The “Custom CSS”

    .dataTables_wrapper .dataTables_filter input {
  vertical-align: bottom;
  border: 1px solid #ff0000;
}

    moves down the “Search:” text and adds a colored border.

    For the text around the pagination box, you’ll need to adjust a text string via a “Custom Command” on the table’s “Edit” screen (this is not that “Custom CSS” textarea, and it’s possible per-table only):

    "language": { "lengthMenu": "Show _MENU_" } }

    Regards,
    Tobias

Viewing 3 replies - 1 through 3 (of 3 total)

The topic ‘Tablepress Search Box Text Alignment and Styling’ is closed to new replies.