7ion

Пользователь
  • Публикации

    82
  • Зарегистрирован

  • Посещение

Репутация

0 Обычная

О 7ion

  • Звание
    Участник

Контактная информация

  • ICQ
    0

Информация

  • Пол
    мужской
  1. Вот за 10 постов мы и пришли к тому, откуда начали В итоге решил добавлять блок .fixer на стороне сервера.
  2. Так. Теперь оставьте текста столько, чтобы картинка распирала блок по высоте.
  3. Я благодарен вам за помощь, но вы не понимаете поставленной задачи. Если отредактировать две ваших последних картинки, то должно быть так (красной линией отмечены границы поля): Попробуйте сверстать это в режиме IE7, используя только div и вложенные в него в любом порядке p и img и любой css-код. Любых других подпорочных и распорочных блоков в html-коде быть не должно, иначе бы я просто встраивал класс .fixer из первого сообщения на стороне сервера, а не яваскриптом.
  4. То, что мне нужно получить в итоге - картинку, прибитую к левому верхнему углу без полей вообще, и текст, который отстоит от краев контейнера на 1em и обтекает картинку. Вот так и вот так (все хорошо в ИЕ8): Вот что я получаю в ИЕ7: В вашем примере, как видно, нижнее поле съедается, но даже если починить его с помощью clear:left, то останется точно такое же поле при небольшом тексте, которого нет в ИЕ8: Поэтому ваш пример не помогает, никак, либо я чего-то не понимаю.
  5. Отступ снизу никуда не девается, и в случае вложенного флоата инспектор показывает даже очень забавные картинки. Для сравнения - в режиме IE8 все адекватно.
  6. Мне нужно, чтобы текст обтекал картинку, если его много.
  7. Обеспечиваю тут поддержку IE7 и не могу найти правильных слов для гугла. Примеры типа "добавьте плавающему элементу display: inline либо zoom: 1" не работают. Есть такой код: <div> <img src="http://placekitten.com/200/200?image=6" /> <p>Текст</p> </div> И к нему CSS div { overflow-y: hidden; } img { float: left; } p { margin: 1em; } Если запустить это в любом ИЕ <= 7, у img появится margin-bottom от подследнего вложенного элемента. В IE >= 8 такого бага нет. Смастерил на коленке фикс: .fix { zoom: expression( this.runtimeStyle.zoom="1", this.appendChild( document.createElement("div") ).className="fixer" ); } .fixer { width: 0; height: 0; } Фикс оказался совершенно хрустальным: после первой JS-ошибки экспрешены не работают, а ошибки, увы, есть. Есть способ как-то починить это без экспрешенов? Демо: http://pskovich.ru/garbage/iebug.html (в иешных средствах разработчика выбрать режим IE7).
  8. SelenIT, отлично, именно то, что мне нужно, спасибо! Для сносного результата достаточно поиграть с левыми-правыми padding и margin. https://jsfiddle.net/94br7sed/1/ Очередные грабли. Парсер позволяет получить на выходе пустой <i></i>. Чтобы его не было видно, добавил i:empty { padding: 0; margin: auto; }. Чтобы при вложенных <i> не множились поля, добавил i > i { padding-left: 0; padding-right: 0; margin: auto; }. А вот на <i> с пустым дитём (<i><i></i></i>) ни одно правило не сработает, будет белая палочка https://jsfiddle.net/94br7sed/3/ Всё, решения на CSS нет?
  9. Никаких скриптов, должен быть чистый CSS.
  10. Есть блок, внутри которого текст, размечаемый юзером. У тега <i> задан цвет фона, padding, background-color. Сказка кончается, когда юзер в сообщении делает, например, [ i ]та[ /i ][ i ]к[ /i ]. В итоге у нас слово, порванное посередине отступом и border-radius. Нормализовать код на стороне сервера нельзя, только css, только хардкор. Я изрядно поломал голову. Нужно, если у элемента <i> есть непосредственный сосед <i> - без любых нод между ними - соседу обрезать padding и border-radius слева, а элементу - справа. При помощи вспомогательного <span>, :first-of-type, :last-of-type и селектора-плюсика я нагородил что-то похожее на правду: https://jsfiddle.net/qqhwcy79/ Однако, все ломается, если между элементами поставить простой текст. Для плюсика сосед через textNode - тоже сосед. https://jsfiddle.net/qqhwcy79/2/ Ну и наконец, никакой обертки из <span> в реальной жизни у меня не будет. В реальной жизни верстка будет такой https://jsfiddle.net/qqhwcy79/3/ Как это сверстать, чтобы схлопнуть два элемента, если они непосредственные соседи?
  11. Равномерная сетка прямоугольников

    Указав 20%, вы жестко засунули 5 блоков на строку. А вы предполагаете, что строк всегда две Блоков может быть любое количество. Ширина блоков одинаковая, за исключением последней строки, определяется шириной самого широкого блока (а его ширина определяется контентом). Контейнер любой ширины. Количество строк и столбцов неизвестно. Высота строк может быть разной. Похоже, без хардкорной яваскриптовой обвязки я тут не обойдусь.
  12. День добрый. Есть контейнер, в контейнере блоки. Блоков может быть любое количество. Контейнер может быть любой ширины. Следовательно, количество строк и столбцов заранее неизвестно. Задача: расположить блоки в контейнере так, чтобы их всегда было одинаковое количество на каждой строке. Если в последней строке не хватает одного-двух блоков, то оставшиеся блоки занимают всю строку. Два дня курю как Flexbox, так и гриды, и не вижу решения. Флексы могут оставить на последней строке один элемент, что ужасно некрасиво. Гриды тоже, плюс они его не растягивают. Решения нет, или я его не вижу? Картинка для наглядности.
  13. Есть код <select> <option value="1">One</option> <option value="2">Two</option> </select> <input type="text" name="unnamed" /> Возможно ли в 2017 году сделать, чтобы input был виден только при выбранном <option value="2">, исключительно с помощью CSS? Трюк с чекбоксом не выходит - <label for=""> в выпадающем списке браузеры (тестил в FF) игнорируют.
  14. Здравствуйте. Такая проблема - не понимаю, как сверстать такой макет: <div class="parent"> <div class="first">Lorem ipsum blah blah blah</div> <div class="second">Something</div></div><div class="parent"> <div class="first">Lorem ipsum blah blah blah</div></div>Задача: при наличии .second у .first должен исчезать margin-bottom. .second может не быть, при его отсутствии first должен корректно распирать родителя. Вот как это должно выглядеть: https://jsfiddle.net/ntanwrks/5/ Возможно ли это сделать, не добавляя лишний класс div.first, который будет просто сигнализировать, что у тебя есть сосед?