La Position du bouton de fermeture sur CSS pop up

J'ai une miniature de l'image, vous pouvez cliquer sur pour ouvrir l'image en taille réelle dans une fenêtre contextuelle div.

Je veux que le bouton de fermeture pour que la pop jusqu'à être dans le coin en haut à droite sur la frontière, mais pas sur l'image elle-même. J'ai joint une capture d'écran exemple à partir d'un autre site de ce que je suis en train de faire, ainsi qu'un exemple de ce que le mien ressemble.

Ce que je veux:

La Position du bouton de fermeture sur CSS pop up

Ce que j'ai:

La Position du bouton de fermeture sur CSS pop up

Voici mon code HTML:

<div id="blanket" style="display:none;"></div>
    <div id="popUpDiv" style="display:none;">
        <a href="#" onclick="popup('popUpDiv')"><img src="images/close.png" align=right></a><img src="images/largeimg.jpg" width=551 height=750>
    </div>  
  <h1><a href="#" onclick="popup('popUpDiv')">Click Here To Open The Pop Up</a></h1>
</div>

Et mon CSS:

#blanket {
   background-color:#111;
   opacity: 0.65;
   position:absolute;
   z-index: 9001; 
   top:0px;
   left:0px;
   width:100%;
}

#popUpDiv {
    position:absolute;
    background-color:white;
    width:551px;
    height:779px;
border:10px solid white;
    z-index: 9002; 
}

Comment puis-je déplacer le bouton de fermeture de sorte qu'il est à la frontière et ne causant que des espaces blancs supplémentaires en raison de l'image du bouton de la hauteur?

OriginalL'auteur useruser5000 | 2012-07-30

  1. 4

    Ici est le travail violon

    CSS

    #blanket {
   background-color:#111;
   opacity: 0.65;
   position:fixed;
   z-index: 9001; 
   top:0px;
   left:0px;
   width:100%;
    height:100%;
}

#popUpDiv {
    position:relative;
    background-color:white;
    width:551px;
    margin:10% auto 0 auto;
    height:259px;
border:10px solid white;
    z-index: 9002; 

}
.close{position:absolute; right:-25px; top:-25px;}

    OriginalL'auteur SVS

  2. 4

    Ne pas ré-inventer la roue. La capture d'écran que vous avez fourni ressemble beaucoup à fancy box. Un jquery plug in. Utiliser à la place. Vous économiserez votre auto de la croix-navigateur maux de tête à l'aide de ce ou de l'un des mainy d'autres semblables plugins jQuery.

    de bons conseils, merci pour le lien. J'ai peut retrouver à l'aide de fantaisie à cocher à la place si je rencontre d'autres problèmes

    OriginalL'auteur Jon P