title: CSS: How do I keep the text from wreaking havoc on the layout?
body: <p>This is probably a really simple fix but I can't seem to find it so I'm turning to you for help. This page: <a href="http://www.prvlocksmiths.com.au/company/choosing-prv-locksmiths-for-sydney-commercial-projects" rel="nofollow noreferrer">http://www.prvlocksmiths.com.au/company/choosing-prv-locksmiths-for-sydney-commercial-projects</a> when resized down has an alignment problem and it's caused by the text being too long on some of the links. This results in the layout of the nicely stacked images to be.. well.. not so nicely stacked.</p>
  
  <p><img src="https://i.stack.imgur.com/V9bbp.png" alt="enter image description here"></p>
  
  <p>How can I fix this?</p>
  
  <p>EDIT: Here's the HTML &amp; CSS</p>
  
  <p><strong>CSS:</strong></p>
  
  <pre><code>#benimg {
      overflow:hidden;
  }
  
  
  .listleft {
      float: left;
      width: 50%; 
  
  }
  
  .listright {
      float: left;
      width: 50%; 
  
  }
  
  .listcentered {
      max-width: 700px;
      margin-left: auto;
      margin-right: auto;
  }
  
  .rowimg {
      display: block;
      clear: left;
  
  
  }
  
  .imglist {
      width: 100%;
      height: auto;
      width: auto\9; /* ie8 */
  
  }
  
  .txtlist{
      text-align: center;
      font-size: 95%;
      padding-bottom: 10px;
  
  }
  </code></pre>
  
  <p><strong>HTML:</strong></p>
  
  <pre><code>&lt;div id="benimg"&gt;
  &lt;div class="listcentered"&gt;
      &lt;div class="listleft"&gt;
          &lt;div class="rowimg"&gt;
              &lt;a href="[[~157]]"&gt;
  &lt;img class="imglist" src="img/benefits/keymarking.png" alt="Key Marking"&gt;&lt;/a&gt;
              &lt;p class="txtlist"&gt;&lt;a href="[[~157]]"&gt;Professional Key Marking&lt;/a&gt;
  &lt;/p&gt;
          &lt;/div&gt;
          &lt;div class="rowimg"&gt;
              &lt;a href="[[~158]]"&gt;
  &lt;img class="imglist" src="img/benefits/cylindermarking.png" alt="Cylinder Marking"&gt;&lt;/a&gt;
              &lt;p class="txtlist"&gt;&lt;a href="[[~158]]"&gt;Professional Cylinder Marking&lt;/a&gt;
  &lt;/p&gt;
          &lt;/div&gt;
          &lt;div class="rowimg"&gt;
              &lt;a href="[[~159]]"&gt;
  &lt;img class="imglist" src="img/benefits/keyterminalreseller.png" alt="Key Terminal Reseller"&gt;&lt;/a&gt;
              &lt;p class="txtlist"&gt;&lt;a href="[[~159]]"&gt;Sydney Locksmith reseller for Keyterminal&lt;/a&gt;
  &lt;/p&gt;
          &lt;/div&gt;
          &lt;div class="rowimg"&gt;
              &lt;a href="[[~160]]"&gt;
  &lt;img class="imglist" src="img/benefits/autojobdispatch.png" alt="Automatic Job Dispatch"&gt;&lt;/a&gt;
              &lt;p class="txtlist"&gt;&lt;a href="[[~160]]"&gt;Automated Job Dispatch System&lt;/a&gt;
  &lt;/p&gt;
          &lt;/div&gt;  
      &lt;/div&gt;
  
      &lt;div class="listright"&gt;
          &lt;div class="rowimg"&gt;
              &lt;a href="[[~156]]"&gt;&lt;img class="imglist" src="img/benefits/pm7masterkeyingsoftware.png" alt="ProMaster 7 Master Keying Software"&gt;&lt;/a&gt;
              &lt;p class="txtlist"&gt;&lt;a href="[[~156]]"&gt;PM7 Sydney Master Keying Software&lt;/a&gt;
  &lt;/p&gt;
          &lt;/div&gt;
          &lt;div class="rowimg"&gt;
              &lt;a href="[[~161]]"&gt;&lt;img class="imglist" src="img/benefits/staffworkshops.png" alt="15 Staff and 8 Mobile Workshops"&gt;&lt;/a&gt;
              &lt;p class="txtlist"&gt;&lt;a href="[[~161]]"&gt;Automatic key machines in all Sydney Workshops&lt;/a&gt;
  &lt;/p&gt;
          &lt;/div&gt;
          &lt;div class="rowimg"&gt;
              &lt;a href="[[~162]]"&gt;&lt;img class="imglist" src="img/benefits/scecendorsed.png" alt="SCEC Endorsed Locksmiths"&gt;&lt;/a&gt;
              &lt;p class="txtlist"&gt;&lt;a href="[[~162]]"&gt;SCEC endorsed Sydney Locksmiths&lt;/a&gt;
  &lt;/p&gt;
          &lt;/div&gt;
          &lt;div class="rowimg"&gt;
              &lt;a href="[[~163]]"&gt;&lt;img class="imglist" src="img/benefits/automatickeymachines.png" alt="Automatic keying machines"&gt;&lt;/a&gt;
              &lt;p class="txtlist"&gt;&lt;a href="[[~163]]"&gt;15 Staff and 8 Mobile Workshops&lt;/a&gt;
  &lt;/p&gt;
          &lt;/div&gt;  
      &lt;/div&gt;
  &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>