Почему текст не отображается под фотографией?

Для улучшения отображения текста под фотографией и повышения ясности и структуры вашего CSS и HTML, стоит внести несколько изменений в код. Проблемы с отображением текста могут быть связаны с тем, как настроены свойства flexbox в CSS, а также организованностью HTML-кода. 

Ниже приведены отредактированные версии CSS и HTML, которые сохраняют оригинальный смысл, но делают его более структурированным и читаемым.

### CSS Код (обновлённый):
```css
.teacher-card {
    display: flex;
    align-items: flex-start;
    text-align: center;
    background: rgba(255, 255, 255, 0.9);
    padding: 20px;
    border-radius: 15px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
    margin: 20px auto; /* Центрируем карточку по горизонтали и добавляем отступ снизу */
    flex-wrap: wrap;
}

.teacher-photo {
    width: 200px;
    height: 250px;
    object-fit: cover;
    border-radius: 10px;
    margin-right: 20px;
}

.teacher-info {
    display: flex; /* Убедимся, что контейнер info занимает всё доступное пространство */
    flex-direction: column; /* Располагаем элементы по вертикали */
    justify-content: flex-start; /* Выравнивание по верхнему краю */
    text-align: left; /* Выравнивание текста в блоке информации */
    width: calc(100% - 220px); /* Учитываем ширину изображения и отступ */
}

.teacher-info h2 {
    font-size: 24px;
    color: #2c3e50;
    margin-bottom: 10px;
}

.teacher-info p {
    font-size: 18px;
    color: #34495e;
    line-height: 1.6;
}

.teacher-info strong {
    display: block;
    margin-bottom: 10px;
    font-size: 20px;
}
```

### HTML Код (обновлённый):
```html
<div class="teacher-card">
    <img src="/css/images/legend_univers/avanova.jpg" alt="Аванова Татьяна Валентиновна" class="teacher-photo">
    <div class="teacher-info">
        <h2>Аванова Татьяна Валентиновна</h2>
        <p>
            <strong>Руководитель начальной школы.<br>
            Учитель математики.<br>
            Почетный работник общего образования РФ.<br>
            Заслуженный педагог Красноярского края.</strong>
        </p>
        <p>
            На практику в 106-ю школу пришла еще студенткой психолого-педагогического факультета Красноярского
            государственного университета в 1988 г. А с 1990 г. штатный сотрудник, учитель математики.
        </p>
    </div>
</div>
```

### Изменения:
1. **CSS**:
   - Добавлено `flex-direction: column;` для `.teacher-info`, чтобы информация располагалась вертикально.
   - Используйте `width: calc(100% - 220px);` для `.teacher-info`, чтобы учесть ширину изображения и отступ, позволяя тексту корректно размещаться.
   - Удалены ненужные свойства, чтобы сделать код более простым и понятным.

2. **HTML**:
   - Каждый элемент внутри `<strong>` теперь завернут в `<br>`, чтобы разделить текст на строки.
   - Удалено окончание фразы "В е", так как она выглядит незавершенной.

Эти изменения помогут наладить отображение текста под изображением и сделают код более понятным и структурированным.

У .teacher-info ширина 100%, поэтому они с картинкой и не умещаются в одном ряду

За обтекание одного элемента другими, в частности картинок текстом отвечает свойство float 
 https://developer.mozilla.org/en-US/docs/Web/CSS/float

.teacher-photo {
float: left;
}