Не сделаете. У вас стратегическая ошибка - один блок с чебоксом и текстом должен быть непременно 24px высотой, иначе спрайт не сработает, но перенос текста вы не предусмотрели. Предлагаю просто сократить длину текста, например не "Доставка курьером по городу - 300 руб", а "Курьером по городу 300руб" и т.п. Или совсем все переделываейте.
Не перестанут, так как вы отмените события мыши только для уже раскрытого блока. Правда он перестанет закрываться, но это можно решить отдельной кнопкой закрытия блока.
1PeGaS: Вы осознате что более кросбраузерным он никогда уже не будет? caniuse.com/#search=flex , ибо разработка браузеров где flex не поддерживается прекращена? Используете и не забивайте себе голову ерундой.
Антон Вебсайтовский: 1. Вот вам 2 блока прижатых влево и право. codepen.io/aliencash/pen/JEZjpG
2. Работает, только на узких экранах, чтобы все перестраивалось вертикально нужно добавить в медиавыражение flex-direction: column
3. Зачем вы вообще центруете содержимое с помощью border? Это что за извращение? Есть куча нормально работающих способов, изучайте, пробуйте https://habrahabr.ru/company/netcracker/blog/277433/
4. чтобы понять как должно работать нужно видеть несколько макетов - с полной шириной, шириной 1024px, шириной 320px. без этого мы тут можем помочь решить только ту проблему, которую вы описали.
. Shadow: Все правильно, но вопрос тут не в хроме и не в body, а в том, что высота 100% - это не высота окна браузера, а высота внутреннего контента. Если какие-то браузеры делают по другому - они не правы. Я предлагаю давать height: 100vh и не иметь таких проблем никогда.
. Shadow: Косяк появляется потому, что у вас для html и body одна и таже фоновая картинка, но в html есть отступы. В глючном примере удалите фон для body и все исправится. Я не сказал, что нельзя трогать. Но я бы, по возможности, не стал бы вешать на них фон.
Gagatyn: li считается строчным (inline) элементом html. для лучшего понимания его можно представлять как букву в слове, таким образом когда браузер видит в коде, что после этой "буквы" идет не другая буква, а пробел, перенос строки или табуляция он думает, что "буква" последняя в слове и вставляет межсловарный интервал, который в вашем случае влияет на ширину вкладки - она становится равна calc(100%/3)+межсловарный интервал и соответственно 3 вкладки уже не умещаются в 100% ширины.
