Flexbox shrink to content size

Question

I have a box using display:flex, and it is not shrinking to its content appropriately(i think). I want the box to only be as wide as the wide as it needs to be to cover the content inside.

  <div class="panel">
      <p>ddddddddddddddddddd</p>
  </div>  

  .panel {
  flex:1;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-around;
  background: #ffffff;
  box-shadow: 0px 0px 5px 5px #c9c9c9;
  -webkit-box-shadow: 2px 2px 5px 5x #c9c9c9;
  -moz-box-shadow: 2px 2px 5px 5px #c9c9c9;
  padding: 0.7em;
}