3 column footer that shrinks

by Jordan Dayton

HTML

<br/>
<br/>
<div class="wrapper">
  <div class="sidebox"></div>
  <div class="box">
    <div class="container">
      <p class="inner"><a href="https://opencourse.canopytax.com/collections" target="_top" class="place-holder"><img src="https://png.icons8.com/dusk/100/ffffff/contract.png" style="margin: 0px 0px 10px 0px;"></a></p>
      <a href="https://opencourse.canopytax.com/collections" style="color: #666666;">FREE CPE Credits (40+)</a>
    </div>
  </div>
  <div class="spacer"></div>
  <div class="box">
    <div class="container">
      <p class="inner"><a href="https://us.canopytax.com/transcripts" target="_blank" class="place-holder"><img src="https://png.icons8.com/dusk/100/ffffff/ledger.png" style="margin: 0px 0px 10px 0px;"></a></p>
      <a href="https://us.canopytax.com/transcripts" style="color: #666666;">FREE IRS Transcripts Tool</a>
    </div>
  </div>
  <div class="spacer"></div>
  <div class="box">
    <div class="container">
      <p class="inner"><a href="https://www.canopytax.com/ebooks/"><img src="https://png.icons8.com/dusk/100/ffffff/book-shelf.png" style="margin: 0px 0px 10px 0px;"></a></p>
      <a href="https://www.canopytax.com/ebooks/" style="color: #666666;">FREE Tax/Accounting eBooks</a>
    </div>
  </div>
  <div class="sidebox"></div>
</div>
<br/>
<br/>

CSS

.wrapper {
  display: table;
  width: 100%;
  text-align: center;
  margin-left: 15px;
}

.box {
  display: table-cell;
  border-radius: 5px;
  width: 26%;
  text-align: center;
}

.sidebox {
  display: table-cell;
  border-radius: 5px;
  width: 9%;
  text-align: center;
}

.container {
  padding: 10px 0;
  width: 80%;
}

.inner {
  margin: 0 auto;
}

.spacer {
  display: table-cell;
  width: 2%;
  text-align: center;
}

img {
  opacity: 1.0;
  filter: alpha(opacity=40);
}

img:hover {
  opacity: 0.5;
  filter: alpha(opacity=100);
}