как установить автоматическую высоту на div для мобильного, но фиксированного рабочего стола

Question

У меня есть сайт, который оформлен в стиле метро.На рабочем столе все плитки фиксированы по ширине.Я хотел бы, чтобы некоторые элементы div основывались на высоте содержимого, когда оно переходит на мобильный телефон.

Если я установил высоту на auto, div исчезнет.

мой сайт http://p2p.rudtek.com/you/. Фотография сверху на рабочем столе - это широкая плитка, а содержимое ниже - в высокой плитке.

.tile.tall {
    width: 488px;
    height: 737px;
}

.tile-post.wide {
    width: 737px;
    height: 488px;
       color: #FFFFFF;
       font-size: 4em;
}

, когда она переходит на мобильный Iхочу, чтобы они были полной ширины и автоматической высоты.

Я пробовал это:

@media screen and (max-width: 480px) {
  .tile-post.wide {
    width: 100%;
    height: auto;
    padding-bottom:0;
  }
  .tile-post.tall {
    width: 100%;
    height: auto;
  }
}

ширина в порядке, но когда я использую авто, они не отображаются, поэтому я долженпоставить высоту.Есть ли способ сделать их автоматически высотой в зависимости от содержимого?

Answer 1

Вы должны добавить это на свой мобильный css:

@media screen and (max-width: 480px) {
   .tile-post > :first-child
   {
      position:relative;
   }
}