Проблема, которую вы описываете, связана с тем, как веб-сервер (хост) обрабатывает файлы и маршрутизацию. Обычно веб-сервер настроен на то, чтобы обслуживать файлы из определенной директории, и он ожидает, что вы будете открывать HTML-файлы, а не CSS или JS файлы напрямую.
Вот несколько причин и решений:
1. **Открытие HTML-файла**: Веб-сервер обрабатывает HTML-файл и использует ссылки на CSS и JS файлы, указанные в этом HTML. Если вы напрямую открываете CSS или JS файл в браузере (через адресную строку или через файловую систему), то сервер не обрабатывает его как часть вашего веб-приложения, и, следовательно, может перенаправить вас в корневую директорию.
2. **Правильные ссылки**: Убедитесь, что в вашем HTML-файле корректно указаны пути к CSS и JS. Например:
```html
<link rel="stylesheet" href="styles.css">
<script src="script.js"></script>
```
Здесь `styles.css` и `script.js` должны находиться в той же директории, что и ваш HTML-файл, или путь должен быть прописан правильно относительно структуры папок.
3. **Использование локального сервера**: Если вы используете локальный хост (например, Live Server в VS Code), запустите его с открытым HTML-файлом. Это обеспечит правильную маршрутизацию и загрузку связанных файлов.
4. **Проверка конфигурации сервера**: Если вы используете что-то вроде Apache или Nginx, убедитесь, что конфигурация вашего сервера правильно настраивает маршруты и директории.
5. **Избегайте прямого открытия файлов**: Для тестирования разработанных файлов всегда открывайте HTML-файл через сервер, а не через файловую систему, чтобы избежать проблем с маршрутизацией.
Если вы всё еще испытываете трудности, попробуйте перезапустить ваш сервер и убедитесь, что все изменения сохранены.