2016-11-07 6 views
0

При работе над проектом я обнаружил, что некоторые из моих изображений на Tumblr не отображаются. Единственный ключ, который я нашел, заключается в том, что в классе responsive-level-1 (см. Ниже для html-кода) высота iFrame установлена ​​равной 0. Если я открываю консоль dev в Chrome и устанавливаю ее, например, 1632 (не 0), появляется изображение. Я использую тему (Brick theme/theme garden), но могу редактировать html и css. Могу ли я изменить свой CSS и/или HTML, чтобы исправить это? Проблема возникает на платформах устройств (рабочий стол/телефон/планшет).Реактивная настройка класса Высота iFrame до 0, в результате чего изображение не отображается

Примера без изображений displayed- http://deligrossery.com/post/149661412746/gawad-deli-grocery-207-hart-st-brooklyn-ny

соответствующих CSS файлов: responsive.css: http://static.tumblr.com/eftyn9y/kc0og8vio/responsive.css style.css: static.tumblr.com/3zmswwt/Fmkmwgp8e/style.css (^ я не могу опубликуйте более двух ссылок, пока моя репутация не будет меньше 10/добавьте https: // в style.css).

<iframe id="photoset_iframe_149661412746" class="photoset" scrolling="no" frameborder="0" height="0" width="500" style="border:0px; background-color:transparent; overflow:hidden;" src="http://deligrossery.com/post/149661412746/photoset_iframe/deligrossery/tumblr_ocn1e9dTfK1txl3g8/500/false" name="photoset_iframe_149661412746"></iframe>

+0

В css попробуйте добавить: '.photoset {height: initial};' вы работаете над этим сейчас, хотя, поскольку в настоящее время для меня сообщение для фотосети не отображается в iframe? – lharby

+0

Привет, спасибо, тогда не работал над этим, проблема в том, что фотосет вообще не отображается в iframe. Я попробовал добавить '.photoset {height: initial};' style.css, но это не так fix things –

+0

Хм хорошо, он работает для меня, и он не отображается в iframe (хотя это было и раньше, когда я проверил). http://imgur.com/a/j8JX6 – lharby

ответ

0

Попробуйте изменить блок макета фотосет на что-то вроде этого (возможно, вам нужно настроить это немного):

{block:Photoset} 
    <div class="content photoset"> 
     {block:Photos} 
      <img src="{PhotoURL-500}"/> 
     {/block:Photos} 
     {block:Caption} 
      <div class="description">{Caption}</div> 
     {/block:Caption} 
      <p><a href="{Permalink}" class="link"></a></p> 
    </div> 
{/block:Photoset} 

Сохраняйте резервную копию текущей темы.

Это должно выводить фотосет в обычном html-шаблоне (не iframe). Оттуда должно быть намного легче контролировать высоту контента, ведь по умолчанию он должен просто выводить контент, и высота будет фиксироваться автоматически. Но после этого могут возникнуть другие проблемы.