Невозможно скрыть привязку с использованием свойства отображения

Question

При работе на веб-странице с плагином prettyPhoto для отображения галереи изображений мне нужно добавить гиперссылки к изображениям, которые показаны в разделе галереи. Но эти гиперссылки приводят к пробелу под изображением, ответственным за запуск галереи.

Демо-код, указанный ниже.

<div class="folio-image"> 
      <a href="images/slider/coverimage.jpg" rel="prettyPhoto[gallery]"><div class="overShadow"></div><h3>Slider title</h3><img src="images/slider/image1.jpg" class="img-responsive max-400" /></a> 
      <a href="images/slider/31.jpg" rel="prettyPhoto[gallery3]" width="0" height="0" display="none !important" ><img src="images/slider/31.jpg" width="0" height="0" display="none !important" /></a> 
</div> 

В приведенном выше коде Folio-image DIV обозначает раздел, который содержит изображение, ответственного загрузить галерею всплывающее окно. overShadow используется для отображения текста на изображении. Первый тег a обозначает изображение, которое отвечает за начало всплывающего окна галереи. Якорные теги, которые следуют позже, ссылаются на другие изображения, включенные в слайдер. Мне нужно скрыть пустое пространство, занимаемое этими привязными метками. Уже пробовали display="none", также отмеченный как important, который также не работал. Как я могу это исправить?

Answer 1

попробовать это или пожалуйста опубликовать рабочий пример/Скриншот

<div class="folio-image"> 
    <a href="images/slider/coverimage.jpg" rel="prettyPhoto[gallery]"> 
     <div class="overShadow"></div> 
     <h3>Slider title</h3> 

     <img src="images/slider/image1.jpg" class="img-responsive max-400" /> 
    </a> 
    <a href="images/slider/31.jpg" rel="prettyPhoto[gallery3]" width="0" height="0" style="display:none; visibility: hidden;"> 
     <img src="images/slider/31.jpg"" width="0" height="0" style="display:none; visibility: hidden;"/> 
    </a> 
</div>