Dialog is not showing in Safari

Dialog is not showing in Safari

    I am trying to show a modal dialog over a Google Map. The code below is working fine in IE,Firefox,Chrome. Using Safari on an iPad the page is grayed out, but dialog does not show up.

    After some investigation I found out that if I edit jquery.ui.button.css and comment out the "display: block;" part, the dialog show up in Safari too.

    .ui-button .ui-button-text {
    /* display: block; */
    line-height: normal;
    }

    Any input on how to solve this would be most appreciated.

    Full webpage:
    2. <!DOCTYPE html>
    3. <html>
    4.   <head>
    5. <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    6. <meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
    7. <script type="text/javascript" src="//maps.googleapis.com/maps/api/js?sensor=false"></script>
    8. <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
    9. <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
    10. <script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
    11. <script>
    12.             var map;
    13.             function sayHello() {
    14.                   var dialogOpts = {
    15.                         modal : true,
    16.         autoOpen : false
    17.                   };
    18.                   $("#infoDialog2").dialog(dialogOpts);
    19.                   $("#infoDialog2").text("Hello");
    20.                   $("#infoDialog2").dialog("open");
    21.       }

    23.             $(function() {
    24.                   var myLatlng = new google.maps.LatLng(-34.397, 150.644);
    25.    var mapOptions = {
    26.    zoom : 12,
    27.    mapTypeId : google.maps.MapTypeId.HYBRID
    28.  };
    29.  map = new                               google.maps.Map(document.getElementById('map_canvas'),mapOptions);
    30.  map.setCenter(myLatlng);
    31. });
    32.       </script>
    33. </head>
    34. <body>
    35. <div id="map_canvas" style="width: 600px; height: 400px;"></div>
    36. <div id="infoDialog2" title="Info"></div>
    37. <button onclick="sayHello()"/>Click Me!</button>
    38. </body>
    39. </html>