Kubeapps: Broken CSS for Secrets table
My Secrets table looks broken. It seems to be some trouble with the flex class, but I know little about HTML/CSS so I can't help much more than just reporting it... :) Can help to debug if you tell me how.
Migrated from #848
lindhe
All 2 comments
Thanks for splitting the issue. @absoludity maybe you can take a look to this? In theory, it's should be enough setting the text-overflow: ellipsis; property (ref)
andresmgot
on 5 Aug 2019
Hi there. The issue occurs when the secret type does not have any normal word break characters, such as hyphens. For example, here is what it looks like when a hyphen is present:
while without hyphens it is as @lindhe found above:
Since the information is important, and we really want it to wrap as it does when hyphens are present, I've just updated it to use overflow-wrap: break-word (rather than ellipsis), so that it can break a word to wrap as needed:
absoludity
on 8 Aug 2019
Related issues
prydonius
路
5Comments
yoshi1979
路
6Comments
migmartri
路
4Comments
doracl
路
7Comments
latiif
路
5Comments
Most helpful comment
Hi there. The issue occurs when the secret type does not have any normal word break characters, such as hyphens. For example, here is what it looks like when a hyphen is present:
while without hyphens it is as @lindhe found above:
Since the information is important, and we really want it to wrap as it does when hyphens are present, I've just updated it to use
overflow-wrap: break-word(rather than ellipsis), so that it can break a word to wrap as needed: