mathjax overlapping in <a> element

I want to write some basic mathematical formulas which I handle using mathjax as below:

<html>
<head>
<style>
body a {
    float: left;
    margin: 0 2px 20px 0;
    border: 1px solid #ddd;
    padding: 1px;
    -moz-border-radius: 4px;
    border-radius: 4px; 
    height:36px;
    width: 36px;
}
</style>
<script type="text/x-mathjax-config">
      MathJax.Hub.Config({tex2jax: {
        inlineMath: [['$','$'], ['\\(','\\)']]}});
    </script>
    <script type="text/javascript" src="http://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML">
    </script>

</head>
<body>

<a title="\sqrt{a}">
$\sqrt{a}$</a>
<a title="\frac ab">
$\frac ab$</a>
<a title="\begin{bmatrix}a&b\\ c&d\end{bmatrix}">
$\begin{bmatrix}a&b\\ c&d\end{bmatrix}$</a>


</body>
</html>

The problem is the overlapping of big formulas. You can see the demo here: https://jsfiddle.net/ev6wf0rd/

Is there a way to configure Mathjax to avoid this problem?

Answers


You could either :


Need Your Help

Clearing A Dynamic Linked List with a Single Stored Element Crashes Program

c pointers dynamic linked-list

For my scholastic assignment I have been given the task of creating a Dynamic Set ADT using linked list. My program is functioning properly, but when I attempt to clear a Set which only has a single