JSFiddle - React, Tailwind, and code Playground

HTML

<div id="parent"><!--// тут у нас width:100%; height:100px; overflow-y:hidden; overflow-x:auto;
     --><div class="parent_carcas"><!--// вот в этом вот блоке переменая ширина. Можно ли ширину эту обойти и при этом 
//... сожержимое данного блока отображалось в одну линию. Элементов внутри может быть от 1 до большого кол-ва.-->
          <div class="item">1</div>
          <div class="item">2</div>
          <div class="item">3</div>
          <div class="item">4</div>
     </div>   
</div>

CSS

.parent-carcas {
    width: 20000em;
    position:absolute;
    right:0;
}
#parent {
    width:100%; 
    height:100px; 
    overflow-y:hidden; 
    overflow-x:auto

    position: relative;

}
.item {
    float:right;
    
    margin:5px;
    background:lightgray;
    width:100px;
    height:90px;
}