nice working and testing

index.html

@@ -18,7 +18,7 @@ body {
   
     
     font-family: "Roboto Condensed", sans-serif;
-	font-size: 1em;
+	font-size: 1.1em;
 	letter-spacing: 0.1px;
 	color: lighter;
 	text-rendering: optimizeLegibility;
@@ -29,8 +29,9 @@ body {
 #chatwin {
     /* color: white; */
     height: 100%;
-    min-width: 150px;
-    max-width: 450px;
+    width: 100%;
+    /* min-width: 150px; */
+    max-width: 510px;
     display: flex;
     flex-direction: column;
    
@@ -61,7 +62,7 @@ body {
 .nameline {
     color: white;
     padding: 5px;
-    width: 25%;
+    width: 27%;
     text-align: center;
     display: flex;
     justify-content: center;
@@ -70,9 +71,9 @@ body {
     flex-direction: column;
     vertical-align: auto;
 
-    flex: 0 0 25%; /* Фиксируем ширину - не растягивается и не сжимается */
+    flex: 0 0 27%; /* Фиксируем ширину - не растягивается и не сжимается */
     min-width: 0; /* Важно для работы переноса текста в flex-контейнере */
-    max-width: 25%; /* Ограничиваем максимальную ширину */
+    max-width: 27%; /* Ограничиваем максимальную ширину */
     word-wrap: break-word; /* Перенос длинных слов */
     overflow-wrap: break-word; /* Современная версия */
     word-break: break-word; /* Разрыв слов если нужно */
@@ -123,7 +124,7 @@ body {
 
 .msgline {
     padding: 5px;
-    width: 75%;
+    width: 73%;
     color: #fff;
 
     flex: 1; /* Занимает всё оставшееся пространство */