Bot messages not aligned

[jessicaduque]

This is a problem that doesn't happen when I don't use the profileAvatar:, but when I use it, for some reason the messages the bot sends don't align. The first one is always more to the left, while any other message said after will be aligned with one another, but all a little bit more to the right when compared to the first message. I've tried to search about where to fix it, but I really have no clue, can anyone please help?

[liefra]

I don't have a solution, but seeing the same issue. Tried to fix it with CSS tweaks, so far without success.

[stale[bot]]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.

[jasonpraful]

Use this style code to hide the profile avatar on messages

.rw-message > img {
  display: block !important;
  visibility: hidden !important;
  width: 0px !important;
  margin: 0px !important;
  border: 0px !important;
  padding: 0px !important;
}

.rw-with-avatar {
  margin-left: 5px !important;
}

.rw-response{
  margin-left: 5px !important;
}

Will add the portion to fix the styling with the avatar in another comment :) Hope this helps

[liefra]

@jasonpraful : Thank you for following up on this. This is indeed helpful. Would be great to see a CSS snippet for a solution with the agent. I tried it, but could make it work.

[jasonpraful]

@jasonpraful : Thank you for following up on this. This is indeed helpful. Would be great to see a CSS snippet for a solution with the agent. I tried it, but could make it work.

Are you using classic JavaScript or a front-end framework like react? @liefra

[ghost]

Use this style code to hide the profile avatar on messages

.rw-message > img {
  display: block !important;
  visibility: hidden !important;
  width: 0px !important;
  margin: 0px !important;
  border: 0px !important;
  padding: 0px !important;
}

.rw-with-avatar {
  margin-left: 5px !important;
}

.rw-response{
  margin-left: 5px !important;
}

Will add the portion to fix the styling with the avatar in another comment :) Hope this helps

@jasonpraful Hi, were you able to find a solution for text alignment with profileavatar?

[liefra]

Are you using classic JavaScript

@jasonpraful : Thank you for following up on this. This is indeed helpful. Would be great to see a CSS snippet for a solution with the agent. I tried it, but could make it work.

Are you using classic JavaScript or a front-end framework like react? @liefra

Sorry, I completely missed your reply. I'm using classic Javascript, not react.

[liefra]

Use this style code to hide the profile avatar on messages

.rw-message > img {
  display: block !important;
  visibility: hidden !important;
  width: 0px !important;
  margin: 0px !important;
  border: 0px !important;
  padding: 0px !important;
}

.rw-with-avatar {
  margin-left: 5px !important;
}

.rw-response{
  margin-left: 5px !important;
}

Will add the portion to fix the styling with the avatar in another comment :) Hope this helps

Hi, were you able to find a solution for text alignment with profileavatar?

No, I haven't see a proper solution yet for text alignment with avatar

[stale[bot]]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.