Mapping divs side by side, css

1

Hello everyone, I am having an issue with css in my application.

<div className="container">
<h1 className="servicestitle">Some services I offer</h1>
<div className="row">
  <div className=" col-lg-5">
   {serviceitems}
        </div>
      </div>
   </div>

I am trying to map these divs and have them appear to be side by side on the page. However no matter what I do they are mapping as one long line down the page. I don’t have that much experience in CSS, what would be a good way to have 2-3 items horizontally on the page?
Thank you in advance for your help.

2

For context, I am not changing any of the css besides the bootstrap classes.
Because every time I do that it seems to make it worse

3

First of all, if you want them to be on the same level, one shouldn’t contain the other. For example, the container will always be above the children elements, so they won’t be on the same line. I recommend checking out flex styles, as they can provide you with the style you’re going for.