hope this fix your issue This bug is 4 years old and still present in the latest Chrome and Safari, but I did find a workaround that doesn't add undesirable whitespace, which is to add an empty :after pseudo-element: http://jsbin.com/oQuBAmIJ/1/edit
White-space and newline between inline-block elements taking up space
An inline-block div with "white-space: normal" exceeds the width of a parent with "white-space: nowrap&qu
By : Josh L
Date : March 29 2020, 07:55 AM
To fix this issue I agree with @hashem That's the expected behavior. By using white-space: nowrap; for the parent, you've collapsed the whitespaces between inline(-block) elements. white-space treats the children, not the element itself. Well if you still need a fix you can add width to second child to make it fit inside container.
inline-block last item wrapping, but there is enough space