Przyczepienie scrolla do rodzica.

Czy istnieje możliwość doczepienia scrolla, w przypadku gdy wewnątrz jakiegoś diva istnieje inny div którego width jest większy od width rodzica?

<div class="Parent-Container" id="Parent-Container">
    <div class="Child-Container-With-Enabled-Horizontal-Scroll" id="Child-1">
        <!-- A lot of elements, which makes horizontal overflow-->
    </div>
    <div class="Child-Container-With-Enabled-Horizontal-Scroll" id="Child-2">
         <!-- A lot of elements, which makes horizontal overflow-->
    </div>
</div>

Powyżej jest przykładowy kod. "Parent-Container" ma ustawione rozmiary. Jeżeli width kontenera o id "Child-1" będzie dłuższy od kontenera o id "Parent-Container", to do kontenera "Child-1" zostanie dodany scroll horyzontalny. Jednakże, ja bym potrzebował żeby ten scroll został doczepiony do kontenera "Parent-Container". Myślałem nad tym, żeby całość zamknąć w jakiegoś diva i jemu ustawić rozmiar i overflow, ale to i tak raczej nie rozwiąże problemu. Coś podobnego do okna przeglądarki, tylko zamykając to w divie. Jest to możliwe do osiągnięcia? Potrzebuję uzyskać efekt taki, żeby wymusić maksymalnie jeden wiersz w divie. Wrzucenie tego w

Nie jestem pewien czy dobrze rozumiem, ale jeśli chcesz, żeby mieć jednego poziomego scrollbara dla obu divów - po prostu ustaw overflow-x: auto wraz z rozmiarem dla diva nadrzędnego.
przykład

Dokładnie o to mi chodziło, tylko wcześniej źle tego używałem :D A teraz się pojawia inny problem. Jeżeli rodzic ma stały rozmiar width: 500px; height 200px i ustawiony overflow-x: auto a wewnątrz niego jest div z ustawionym rozmiarem ale w % np. width: 100% to jeżeli pojawi się overflow to rozmiar parenta się nie zmienia, natomiast rozmiar wewnątrz parenta już tak, co powoduje że jeżeli child ma ustawiony borded: 1px solid black to jest miejsce gdzie border jest niewidoczny. Jak to można naprawić?

Ustaw box-sizing: border-box