引导程序中的行中的列未填充页面宽度

I have a section of a website that has 2 rows inside a container, both rows have 3 columns of class col-sm-4 and col-md-4. Both rows have 1 image in each column. All images are exactly the same size at 300px wide. The top row displays accurately, the bottom row condenses the 3 columns and leave a big area of wide space on the right side. When using the inspector, The top row columns are appearing as class col-md-4, but the buttom row columns are showing as col-sm-4. I'm not sure if this is whats causing it. I should mention also that the top row columns have paragraphs below each image. When adding the exact same paragraph content to the bottom row in just 1 column, the issue is resolved, but I don't want paragraphs here. I checked out the bootstrap CSS and my own to try and find some sore of style on I have a section of a website that has 2 rows i