Aligning Images Horizontally Using Bootstrap?

Tell us what’s happening:
I am trying to align some images on the same row and have like 2 rows of 3 images. Should I be trying to align images using bootstrap the same way as we’ve done with buttons from one of the Bootstrap lessons?
I have created the div elements with class: container-fluid, row and a variety of use of the column class (col-md-4 or something). I get no horizontal alignment of my images. I was able to get them to align horizontally at one point (using only CSS), but they overlapped and responded poorly to the changing of the window size so I would like to use bootstrap if I can.

Here is a clip of my code for this issue.
Your code so far

<div class="container-fluid" id="goldsrc"><h4>GOLDSRC</h4>
       <div class="row">
          <div class="col-xs-6">
      <img id="half-life" class="img-responsive game-img-size img-fluid" style="100%" src="">
       <div class="caption">1998</div>
<!--new img-->         
         <div class="col-xs-6">
      <img id="team-fortress-classic" class="game-img-size img-fluid" src="">
      <div class="caption">1999</div>
<!--new img-->            
           <div class="col-xs-6">
      <img id="counter-strike" class="game-img-size img-fluid" src="">
      <div class="caption">2004</div>

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/92.0.4515.159 Safari/537.36

Challenge: Build a Tribute Page

Link to the challenge:

I’ve edited your post for readability. When you enter a code block into a forum post, please precede it with a separate line of three backticks and follow it with a separate line of three backticks to make it easier to read.

You can also use the “preformatted text” tool in the editor (</>) to add backticks around text.

See this post to find the backtick on your keyboard.
Note: Backticks (`) are not single quotes (’).

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.