title: Center four images in css
body: <p>Basically I want to center within a div tag with a class name container 4 pictures looking like a windows. Here is my code</p>
  <pre class="lang-html prettyprint-override"><code>&lt;div class=&quot;container&quot;&gt;
    &lt;div class = &quot;arriba&quot;&gt;
        &lt;img class = &quot;pic&quot; src=&quot;img/il00.jpg&quot;&gt;
        &lt;img class=&quot;pic&quot; src=&quot;img/web00.png&quot;&gt;
    &lt;/div&gt;
    &lt;div class=&quot;abajo&quot;&gt;
        &lt;img class=&quot;pic&quot; src=&quot;img/logo.jpg&quot;&gt;
        &lt;img class=&quot;pic&quot; src=&quot;img/w.png&quot;&gt;
    &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  <p>here is my css</p>
  <pre class="lang-css prettyprint-override"><code>.container{
      display: grid;
      left: 50%;
      
  }
  img.pic{
      padding: 5px;
      object-fit: cover;
      width: 360px;
      height: 360px;
  }
  </code></pre>