Adding code for an image map creates a big space below the table

  • Resolved Person123

    (@person123)


    6 years, 7 months ago

    /* When I add the below image-map code to a single cell of the table it looks and works great on the front end apart from for some reason there is around 14 lines of white space below it. The code is an image-mapped PNG image I am using for a thumbnail on an ecommerce site. I would really appreciate any help. I am more than happy to get you a few coffees if you can help! Thank you very much */

    <img src="https://examplesite.com/wp-content/uploads/2017/10/Mi4c-Thumbnail-top-cut-off.png" border="0" width="472" height="346" alt="" />
<map name="image-maps-2018-04-30-095446" id="ImageMapsCom-image-maps-2018-04-30-095446">
<area  alt="" title="" href="https://examplesite.com/about-us/" shape="rect" coords="13,15,184,38" style="outline:none;" target="_self"     />
<area  alt="" title="" href="https://examplesite.com/about-us/" shape="rect" coords="24,56,135,272" style="outline:none;" target="_self"     />
<area  alt="" title="" href="https://examplesite.com/about-us/" shape="rect" coords="163,63,391,84" style="outline:none;" target="_self"     />
<area  alt="" title="" href="https://examplesite.com/about-us/" shape="rect" coords="322,102,399,116" style="outline:none;" target="_self"     />
<area  alt="" title="" href="https://examplesite.com/about-us/" shape="rect" coords="305,126,383,141" style="outline:none;" target="_self"     />
<area  alt="" title="" href="https://examplesite.com/about-us/" shape="rect" coords="309,152,387,168" style="outline:none;" target="_self"     />
<area  alt="" title="" href="https://examplesite.com/about-us/" shape="rect" coords="258,176,340,191" style="outline:none;" target="_self"     />
<area  alt="" title="" href="https://examplesite.com/about-us/" shape="rect" coords="299,202,381,217" style="outline:none;" target="_self"     />
<area  alt="" title="" href="https://examplesite.com/about-us/" shape="rect" coords="348,228,430,243" style="outline:none;" target="_self"     />
<area  alt="" title="" href="https://examplesite.com/about-us/" shape="rect" coords="186,253,268,268" style="outline:none;" target="_self"     />
<area  alt="" title="" href="https://examplesite.com/about-us/" shape="rect" coords="313,305,458,333" style="outline:none;" target="_self"     />
<a href="#" title="Compare"><area style="outline: none;" title="" alt="" coords="201,323,274,339" shape="rect" />
</map>
Viewing 6 replies - 1 through 6 (of 6 total)
  • Thread Starter Person123

    (@person123)

    Pastebin link: https://pastebin.com/Ktxg297i

    Plugin Author TobiasBg

    (@tobiasbg)

    Hi,

    thanks for your post, and sorry for the trouble.

    The reason for this are the line breaks in the code. These get changed to HTML <br /> tags automatically. Either remove all line breaks from the code or turn off that conversion by adding another parameter to the Shortcode on that page, like`

    [table id=123 convert_line_breaks=false /]

    Regards,
    Tobias

    Thread Starter Person123

    (@person123)

    Thank you so very much Tobias! What is your email for an amazon gift card?

    Plugin Author TobiasBg

    (@tobiasbg)

    Hi,

    no problem, you are very welcome! ?? Good to hear that this helped!

    Please use e.g. tobias at tablepress dot org.

    Thanks!
    Tobias

    Thread Starter Person123

    (@person123)

    Thanks mate. Just sent you a gift card

    Plugin Author TobiasBg

    (@tobiasbg)

    Hi,

    thanks, I have received it! I really appreciate it!

    Best wishes,
    Tobias

Viewing 6 replies - 1 through 6 (of 6 total)
  • The topic ‘Adding code for an image map creates a big space below the table’ is closed to new replies.