Fix problems with message screen layout at certain window sizes (backport of MDL-53147)

Login as two different users and send messages to the third user. Login as this third user and go to your messages. You will see two names on the left, click on one of them to see conversation (the attached screenshot is how the page used to look). Do the 'responsive resize scrub' - slowly change the browser width from very small to very big and note all the places where the layout is broken or non optimal: 260px - the two avatars stack weirdly 1200 - 1300px lots of wasted space 1305 - 1500px page is practically unusable Apply the patch and repeat and everything should be more smooth and usable at all widths Rinse and repeat with a right-to-left lang mode on. Run this in dev tools to toggle quickly: document.getElementById('page-message-index').classList.toggle("dir-rtl") If you have any trouble recreating the screenshot then comment out lines 498 and 500 of message/lib.php Having the navigation block on the right Login as an admin. Go to Site administration ► Appearance ► Default Dashboard page Click on Blocks editing on Click the gear icon on the Navigation block and click Configure Navigation block . On the Where this block appears sectionm set the Navigation block's Default region to Right . Click Save changes Back on the Default Dashboard page, click Reset Dashboard for all users . Login again as the third user and go to the Messages screen. Resize the browser window with various widths. Confirm that the layout adapts responsively, does not break, and renders the messaging screen usable. Repeat the previous steps in RTL. Confirm that the layout adapts responsively, does not break, and renders the messaging screen usable.