css fixes

- don't pronounce avatar initials
 - prevent room header growing wider than screen
 - ensure messages wrap their text

src/ui/web/css/avatar.css

@@ -15,6 +15,7 @@
     letter-spacing: calc(var(--avatar-size) * -0.05);
     background: white;
     color: black;
+    speak: none;
 }
 
 .avatar.large {

src/ui/web/css/layout.css

@@ -48,6 +48,7 @@ body {
 .TimelinePanel {
     flex: 3;
     min-height: 0;
+    min-width: 0;
     display: flex;
     flex-direction: column;
     height: 100%;

src/ui/web/css/room.css

@@ -31,7 +31,7 @@
 }
 
 .RoomHeader .room-description {
-    flex: 1 1 0;
+    flex: 1;
     min-width: 0;
 }
 

src/ui/web/css/timeline.css

@@ -15,6 +15,8 @@
     padding: 5px 10px;
     margin: 5px 10px;
     background: blue;
+    /* first try break-all, then break-word, which isn't supported everywhere */
+    word-break: break-all;  
     word-break: break-word;
 }