title: Hover Share Button Over Every Image
body: <p>I am using an embedded quiz platform, see <a href="https://output.jsbin.com/pabopusulo" rel="nofollow">https://output.jsbin.com/pabopusulo</a>.</p>
  
  <p>I want to make every image hover a "Share button" centered in the middle. </p>
  
  <p><strong>Facebook share code:</strong></p>
  
  <pre><code>&lt;div class="fb-share-button" data-layout="box_count"&gt;&lt;/div&gt;
  </code></pre>
  
  <p>I tried doing this using CSS by calling the div to <code>display:block;</code> but it did not work. I am not sure if this is even possible. Please keep in mind, I am new to coding.</p>
  
  <p>Thanks all.</p>
  
  <p>UPDATE:
  <strong>embedded script:</strong> </p>
  
  <pre><code>&lt;script type="text/javascript" src="//cdn.playbuzz.com/widget/feed.js"&gt;&lt;/script&gt;
  &lt;div class="pb_feed" data-embed-by="6c7dc1a3-ea2c-490e-8b3f-8526cdf5bcb4" data-game="/drishtib10/what-is-your-personality-type-according-to-your-perception" data-recommend="false" data-game-info="false" data-comments="false" data-shares="false" &gt;&lt;/div&gt;
  </code></pre>