Классы col-md-8 и col-xl-10 в Bootstrap представляют разные настройки для разных видов устройств. Класс col-md-8 применяется для устройств среднего размера (от планшетов и выше), а col-xl-10 применяется для устройств с экстра-большими экранами (шире 1200 пикселей).
Чтобы класс col-xl-10 работал правильно вместе с остальными классами, нужно учитывать порядок иерархии классов. Например, для того чтобы элемент занимал 8 колонок на устройствах среднего размера и 10 колонок на устройствах с экстра-большими экранами, код должен выглядеть следующим образом:
```html
<div class="container">
<div class="row">
<div class="col-md-8 col-xl-10">Content</div>
</div>
</div>
```
Таким образом, при использовании правильного порядка классов col-md-8 и col-xl-10, элемент будет занимать 8 колонок на устройствах среднего размера и 10 колонок на устройствах с экстра-большими экранами.
Если необходимо использовать разные настройки для разных размеров экранов, рекомендуется внимательно проверить правильность порядка иерархии классов и применение правильных классов в соответствии с размерами устройств.