Stop Mini Panels adding --1/2/3 etc to blocks
Drupal blocks aren't particularly aware of other blocks on the page, and you could legitimately have a mini panel block added with Panels and another  of the same added somewhere else with Drupal's regular block system or some other display module -  they would be completely unaware of each other and therefore without the appended numbers could end up with the same ID. Certain things in Javascript can break if two elements on a page  have the same ID, so it's pretty important to make sure this can't happen.

The best way to get a good stable clean ID for styling purposes is to add the mini panel block using  something with the panels/context interface (panels or page manager (comes with ctools, under Structure > Pages in menu) or panels everywhere etc), and use the block settings option to set an id that is specific and semantically relevant. It takes slightly longer in the short term, but saves a lot of trouble in the long term and gives you cleaner, more readable, more manageable HTML. 

Generally speaking, replacing Drupal's default generated markup with clean lean semantic markup is a good idea (if somewhat tedious and time consuming).  Remember that Drupal's default auto-generated markup is intended for stability and flexibility in development more than it is for best practices in production. See also this similar common complaint about messy markup: Changing the HTML produced by Panels: Is it possible?