Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Datatables input glow cut off #284

Open
mvanbeekum opened this issue Aug 22, 2019 · 5 comments
Open

Datatables input glow cut off #284

mvanbeekum opened this issue Aug 22, 2019 · 5 comments
Assignees
Labels

Comments

@mvanbeekum
Copy link

Is there a quick fix to have the focused input box show the full dropshadow/glow?

image

@tiesont
Copy link

tiesont commented Aug 22, 2019

The "glow" (the :focus style) is being hidden by the overflow rule from .table-responsive. If you eliminate that wrapper div, the style displays as (likely) intended. Whether that works for you is up to your needs when customizing / implementing this template.

This is a known "issue" with the table component: https://getbootstrap.com/docs/4.3/content/tables/#responsive-tables

@mvanbeekum
Copy link
Author

The .table-responsive class is pretty useful for me so I'd like to keep it.

I've added some padding to it as a quick fix:
<div class="table-responsive" style="padding: 3px 3px 0 0;">

@tiesont
Copy link

tiesont commented Aug 22, 2019

You could also add a consistent bit of padding around the whole table, using one of the padding classes:

<div class="table-responsive p-1">

With that, you get the whole focus effect and the same amount of white-space on each side of the grid.

@mvanbeekum
Copy link
Author

That also worked well. Thank you.

@davidtmiller davidtmiller self-assigned this Jun 19, 2020
@Harpreet-kaurr
Copy link

can i fix this issue?

manuelep pushed a commit to gtergeomatica/emergenze-pcge that referenced this issue Sep 20, 2023
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

No branches or pull requests

4 participants