Question

我可能犯了一些愚蠢的CSS错误。我无法将关闭窗口图标显示在模态窗口之外，它会在边缘处剪切。

<div id="sendMsgForm" class="modal">
    <div class="closeBtn" >
        <a href="#" onclick=""><img src="close-icon.png" alt="Close Form"></a>
    </div>
    (content)
</div>

.modal 
    {
    background: #EEE ;
    -webkit-border-radius: 7px; -moz-border-radius: 7px; border-radius: 7px;
    border:solid 1px #ccc; 
    padding: 0;
    overflow: auto;
    z-index: 1001;
    position: fixed;
    min-width: 300px;
    max-width: 400px;
    min-height: 250px;
    top: 20px;
    left: 20px;
    }

.closeBtn
    {
    display: block;
    float:right;
    position:relative;
    top:-10px;
    right: -10px;
    z-index: 1002;
    }

Answer 1

由于您在模态上设置了overflow: auto;，因此它被剪掉了。将其更改为可见。

.modal {
    overflow: visible;
}

http://jsfiddle.net/4bBx3/3/

在模态div外延伸关闭窗口图标

1 个答案: