table { /* table-layout: fixed; */ } th, td { } .message-from-user { max-width: 400px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; } .overflow-icon { position: relative; } .overflow-icon::before { display: block; content: ""; vertical-align: -.125em; background-image: url("data:image/svg+xml,"); background-repeat: no-repeat; background-size: 1rem 1rem; position: absolute; bottom: 2px; right: 1px; width: 1rem; height: 1rem; } @media only screen and (max-width: 500px) { /* Remove padding from container, but keep it on stuff that isn't navbar or chat messages. */ .container-md { padding-left: 0px; padding-right: 0px; } #backup-info { padding-left: 1rem; padding-right: 1rem; } /* Table stuff */ #chat-display table { table-layout: fixed; } .message-mobile-date-time { width: 1em; } .message-from-user { width: 6em; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; } td.message-content div { display: inline-block; max-height: 100px; } }