css - 居中的第二个 div 具有更高的 z-index

Question

我正在尝试将一个 div (boxTest) 集中在一个 100% 宽度和高度固定的 div 中。

下面是代码，这里是一个jsfiddle

html

 <a href="#" class="clickme">CLICK ME</a>

jQuery

 $( function() {
    $(".clickme").click(function() {
    $('body').append('<div class="videoMask" style="position:fixed; top:0; bottom:0; z-index:14000000; left:0; right:0; width:100%; height:100%; background-color:#000000;"></div><div id="boxTest" style=" width:150px; background:#FFFFFF; position:fixed; top:10px; z-index:15000000; height:150px; margin:0; padding:0;"><span class="closeMe">CLOSE</span></div>');
    $('#boxTest').show();   
 });

     $( ".closeMe, .videoMask" ).live('click', function() {
        $( "#boxTest" ).remove(); 
        $( ".videoMask" ).remove();  
     });   
 });

P.s 行内样式会改变，我这样做是为了让它在这里更容易看到。

提前感谢您的任何回复。

Answer 1

尝试将此样式应用于#boxTest 以使其水平居中...

#boxTest
{
    width:150px;
    position:absolute; /* OR FIXED IF THIS WORKS BETTER FOR YOU */
    margin-left:-75px;
    left:50%;
}