Jump to content
  • 0

Адаптивность кнопки в привязке к внешнему контейнеру


Ich
 Share

Question

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

Вот пример https://jsfiddle.net/yhnf3m9L/1/

положение вроде сохраняется, а вот размер - беда.

Link to comment
Share on other sites

0 answers to this question

Recommended Posts

There have been no answers to this question yet

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Answer this question...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

 Share

  • Similar Content

    • By FlixTheBro
      В ступоре. Очень прошу помощи.
      Дело такое. Верхняя шапка сайта (фиолетовая) не хочет адаптироваться под телефоны, причём всё остальное работает, кроме самой шапки и футера.
      Так же замечена очень интересный баг: при проверки адаптивности сайта ресайзом окна или масштабированием в google chrome для десткопа или даже проверке с помощью специальных ресурсов - всё работает как надо. Вы можете сами проверить по адресу flixthebro.com
      При этом заходя на сайт с любого мобильного устройства (тестировал на 3-х) выдаёт почему то другой результат.
      Ещё несколько забавных примечаний: допустим установил я размер текста в шапке 32px и в контенте 32px. На телефоне размер шрифта в шапке никак не сопоставим с размером шрифта в контенте и намного мельче. То же самое и с футером. / Так же я эксперементрировал и пробовал убирать разные строки из css и ничего не получалось. Чем же эти два фиолетовых блока провинились? Почему они такие "особенные"?
      Ах да ещё надо бы сказать, что сайдбар сделан только для того, чтобы в случае надобности начать его использовать активировать легко и просто, сейчас он абсолютно не нужен, но в отличие от этих двух работает отлично.
      Я отчаялся и совсем перестал хоть каплю иметь соображения из-за чего это может быть. Прошу помощи от вас, господа формучане.
       
       
       
    • By mok
      Прикручиваю шаблон zerofour в денвере. В head не работают стили в обертке noscript
      <script src="{THEME}/js/skel.min.js"></script> <script src="{THEME}/js/skel-panels.min.js"></script> <noscript> <link rel="stylesheet" href="{THEME}/css/skel-noscript.css" /> <link rel="stylesheet" href="{THEME}/css/style.css" /> <link rel="stylesheet" href="{THEME}/css/style-desktop.css" /> </noscript> Без noscript стили работают, но не работает мобильный дизайн. Получается не подключаются стили через js.  Как это обойти?
    • By itook.ru
      Доброго времени суток, на сайте i-took.ru при мобильном разрешении строка поиска и рекламный блок перекрывают друг друга, не смог решить проблему
      <form method="post" action="" class="search"> <input type="hidden" name="do" value="search" /> <input type="hidden" name="subaction" value="search" /> <input id="story" name="story" class="searchTerm" placeholder="Поиск по сайту ..." /> <input class="searchButton" type="submit" /><span class="searchIcon entypo-search"></span> </form> <div class="m20"> <a href="http://i-took.ru/" target="_blank"> <img src="{THEME}/assets/img/monitor.png" class=""> </a> </div> спецы гляньте пожалуйста, буду благодарен
    • By Flexible Curd
      Всем доброго времени суток.
      При адаптивной вёрстке вы заморачиваетесь такими вещами как: 
      -PageSpeed(использование кэша браузера и т.п.)
      -Оптимизация файлов(подключение/отключение требующихся скриптов, картинок и т.п. при разных расширениях, то есть не просто все(что нужно и не нужно) подгружать при всех расширениях)
       
      Я о подобных вещах читал в книге Итана маркотта: отзывчивый веб-дизайн.
      Или всем этим занимается кто-то другой(seo и т.п специалисты)?
×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue. See more about our Guidelines and Privacy Policy