title: Html5 drag and drop unicode chessboard
body: <p>I am trying to do html5 dragndrop on my html5/css chessboard using unicode pieces but have a problem at the moment with it.
  On dragging &amp; dropping the whole 'li' element seems to move &amp; on drop this disrupts the board.</p>
  
  <p>This can be seen on the chess WordPress site at:
  <a href="http://www.buryknightschess.org.uk/play-chess/" rel="nofollow"></a>
  <a href="http://www.buryknightschess.org.uk/play-chess/" rel="nofollow">http://www.buryknightschess.org.uk/play-chess/</a></p>
  
  <p>(As can be seen I asked for help with this on SitePoint Forums but haven't had a reply to help yet from there).</p>
  
  <p>Possibly I somehow need just to make the unicode chess pieces draggable &amp; not the whole chess square (<code>&lt;li&gt;&lt;/li&gt;</code>).</p>
  
  <p>I shall keep trying to fix this but meanwhile I would greatly appreciate any advice to help with this html5 dragndrop issue. I look forward to helpful replies, many thanks</p>