I seem to be experiencing a CSS mistake that I can't figure out. The close window icon in my modal window is getting cut off at the edge and not displaying properly.
<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;
}