When a chat reply is highlighted, it temporarily changes the right margin, narrowing the message area and in some cases causing the height to change (which makes elements on the page jump):

enter image description here

The cause is pretty straightforward. In the chat CSS .highlight is styled like this:

.highlight {
    background-color: #ff0 !important

But also, separately, for some reason a margin is added:

.message.highlight {
    margin-right: 48px

No margin should be specified.

  • It looks like it's designed to allow for the timestamp on the right... which also makes me think that the transcript view and the in-room view possibly need slightly different styling. (Just leaving a note here for whoever ends up actually fixing this. :))
    – Adam Lear StaffMod
    Jun 10, 2017 at 4:35
  • It does kinda look that way, huh. Odd choice, though, since it appears to look perfectly fine with no margins on timestamped containers, in both the chat and transcript views.
    – Jason C
    Jun 10, 2017 at 5:10


You must log in to answer this question.

Browse other questions tagged .