Lightbox2:如何在“lb-prev”和“lb-next”分区之间添加“编辑”<a>

我正在使用"http://lokeshdhakar.com/projects/lightbox2/"中的灯箱2。 我让一切按预期工作，但我想添加一个"编辑"功能，以便我可以打开一个页面，允许我通过 IPTC 将数据添加到 jpg 图像文件中。 我试图在.js文件中的"lb-prev"和"lb-next"锚点之间放置一个"<a>"，我修改了.css文件以包含"lb-edit"并调整了宽度，但是当图像显示时，"lb-next"在容器下方。 "lb-prev"的css有"float：left"，"lb-next"的css有"float：right"，但是如果我在中间放一些东西，"lb-next"就会掉下来。 我尝试了"显示：内联"无济于事。 谢谢。 片段如下：

灯箱.js有：

`<div class="lb-nav"><a class="lb-prev" href="" ></a><a class="lb-edit" href=""></a><a class="lb-next" href="" ></a></div>`

。和。。。

this.$lightbox.find('.lb-edit').on('click',function() {
  window.location.href="../../lb-edit.php"
});

灯箱.css有：

.lb-prev, .lb-edit,.lb-next {
height: 100%;
cursor: pointer;
display: block;
}
`.lb-nav a.lb-prev {
 width: 33%;
 left: 0;
 float: left;
 background: url(../images/prev.png) left 48% no-repeat;
 filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
 opacity: 0;
 -webkit-transition: opacity 0.6s;
 -moz-transition: opacity 0.6s;
 -o-transition: opacity 0.6s;
 transition: opacity 0.6s;
 }
 .lb-nav a.lb-prev:hover {
 filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
 opacity: 1;
 }
 .lb-nav a.lb-edit {
 width: 34%;
 left: 0;
 margin-right:auto;margin-left:auto;
 background: url(../images/edit.png) left 48% no-repeat;
 filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
 opacity: 0;
 -webkit-transition: opacity 0.6s;
 -moz-transition: opacity 0.6s;
 -o-transition: opacity 0.6s;
 transition: opacity 0.6s;
 }
.lb-nav a.lb-edit:hover {
 filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
 opacity: 1;
 }  
 .lb-nav a.lb-next {
 display:inline;
 width: 33%;
 right: 0;
 float: right;
 background: url(../images/next.png) right 48% no-repeat;
 filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
 opacity: 0;
 -webkit-transition: opacity 0.6s;
 -moz-transition: opacity 0.6s;
 -o-transition: opacity 0.6s;
 transition: opacity 0.6s;
 }
 .lb-nav a.lb-next:hover {
 filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
 opacity: 1;
 }