1

I am using a css file for lightbox it display close X cross in bottom of the image i want that in top how to do this

belwo is my css file 

 /* line 112, ../sass/lightbox.sass */

 .lb-data .lb-close {
 width: 35px;
 float: right;
 padding-bottom: 0.7em;
  outline: none;
}


/* line 117, ../sass/lightbox.sass */


.lb-data .lb-close:hover {
 cursor: pointer;
 }
4

1 に答える 1

1

Hey i think you want as like this

First think you should define your main container position relative and give to close button position absolute and define left right top bottom according to your layout ...

Css

.lb-data{
width:200px;
    height:200px;
    background:red;
    margin:100px 0 0 100px;
    position:relative;
}

.lb-data .lb-close {
 width: 35px;
    height:25px;
  position: absolute;
 padding-bottom: 0.7em;
  outline: none;
    top:-36px;
    right:-13px;
    background:green;
    color:white;
    font-weight:bold;
}


/* line 117, ../sass/lightbox.sass */


.lb-data .lb-close:hover {
 cursor: pointer;
 }

HTML

<div class="lb-data">


    <div class="lb-close">XX</div>

</div>

Live demo http://jsfiddle.net/rohitazad/GgGzm/

于 2012-04-19T09:00:29.623 に答える