Launder

Ну в общем, вывод прост - учить DOM и JS. В процессе ? Возможно, после изучения, стану лучше понимать CSS, поскольку теоретически, мне тут не всё ясно...

Вот это меня и удивляет ? Допустим в коде: a { color: blue } a:hover { color: green } a:active { color: red } или тут: input:checked + label { background: white; } стили применились к параметрам по-умолчанию, но поменялись параметры - поменялись стили. во втором примере, тот же input, правда другого типа. Но поскольку стили для изменённых параметров уже загружены и селекторы, для их идентификации, есть во всех случаях, я не понимаю, в чём принципиальная разница, между тем, что приведено в заголовке темы, и приведёнными выше примерами. ведь значение value меняется с помощью самого браузера! что ему сложно применить уже загруженные стили для изменённого значения? если да, то в чём сложность или где тут несоответствие? С ними и возникнет.

Решил поэкспериментировать с динамическим изменением индикации, вот по этому заданию. Как мне казалось, это реально: стили для любого значения параметра загружаются сразу, изменяется параметр - сразу применяются стили, соответствующие новому параметру. Но почему-то эта "динамика" работает, только для параметра, заданного по-умолчанию. Почему стили не применяются к изменённому параметру? Какова тут логика работы и возможно ли подобное, сделать на чистом CSS? Спасибо. PS: ну и до кучи - буду рад инфе, как стилизовать input type='number '?

Да причём тут толерантность? Вот какая Вам разница какого пола человек? Какая разница кем он себя считает? К теме сообщества это отношения не имеет. Но если, так сказать, в рамках общей информации, человек решит указать пол, то уже само это указание, говорит о его ГЕНДЕРНОЙ ПРИНАДЛЕЖНОСТИ, и не имеет противопоказаний (поскольку графы трансгендер среди выбора вариантов нет). И кроме этого, секс, у людей постсоветского пространства, имеет больше ассоциаций с половым поведением, чем с половой принадлежностью, а гендер воспринимается как информация о поле и всё. Чем он и лучше...

Речь как раз идёт не о "ком-то другом". Имея возможность указать два возможных варианта пола, если человек считает что он, например трансгендер, то он, В ПРИНЦИПЕ, в соответствующей теме, может про это рассказать. Понятно, что сообщество не об этом...

Я имею в виду, что при большом желании, человек может о себе рассказать, что он, скажем, трансгендер (да хоть крокодил) в соответствующей теме.

Владелец webref.ru неправильно настроил свой веб-сайт. Чтобы защитить вашу информацию от кражи, Firefox не соединился с этим веб-сайтом. Этот сайт использует Форсированное защищённое соединение HTTP (HSTS), чтобы указать, что Firefox должен подключаться к нему только через защищённое соединение. В результате, добавление исключения для этого сертификата невозможно.

Эко Вас накрыло...

Да дело не в том, что норм или не норм, а в том, что на форуме нам пофиг, что у него там есть. Если чел не хочет определять свой пол, он просто его не пишет, а если всё-таки считает нужным указать, то это более соответствует gender, поскольку само то, что он это указывает, говорит о его определённой самоидентификации. При этом, речь не идёт, что он на этом ставит какой-то акцент, просто указывает и всё. С половым полом:) gender в противоречия не вступает (хотя бы потому, что, насколько я понимаю, можно выбрать только из двух известных вариантов). Если не считает нужным выбирать, просто оставляет всё как есть и позиционирует себя как считает нужным, в рамках правил форума...

Что-то не работает сегодня...

Как раз из видео, предположу, что Gender подходит больше - какая нам разница что в штанах у абонента? Sex больше относится к биологической составляющей, а Gender - к психологической. Но Gender это не только самоощущение, но и пол тоже. А поскольку, я так понимаю, признак не обязательный, то это просто возможность указать свой пол. Не на свои первичные и прочие половые признаки, а сам пол - Gender. Кроме этого, sex наводит русского пользователя на ассоциацию с половым действием, а gender таких ассоциаций не порождает...

Задайте для ссылок text-decoration: none в явном виде.

Вот и я не уверен. Вот и ломаю теперь голову Возможно Вы и правы, и оно того не стоит...

Да нет, понятно, что так можно сделать, да и много как по-другому сделать можно. Тут вопрос именно в том, чтоб html трогать по-минимуму и разобраться в возможностях CSS. Ну так можно наверняка. В этом Вы абсолютно правы. Надеяться на контент, в любом случае, не вполне правильный подход, на другой ОС, в другом браузере, что-то может отобразиться немного по-другому. Но с другой стороны, если наверняка знаешь, что контент будет меняться редко, то, наверное, можно воспользоваться этим костылём...

Вот кот. Предполагается, что элемент не выводится из потока (по крайней мере, нужно чтоб он взаимодействовал в "строке" с другими элементами, предполагается, что за block-center могут также находится элементы). Загвоздка следующая: левый блок (block-1) имеет минимальный размер в пикселях(150px) и натуральный размер в rem (15rem, при том, что 1rem = 10px). Хочется оставить пользователю возможность менять в браузере размер шрифта, при этом положение левого края второго элемента (block-center) должно оставаться посередине (или в ином заданном месте). Для второго элемента указано свойство: padding-left: calc(50% - 15rem); /* тут может быть и 150px*/ При использовании rem во-второй части выражения, элемент уходит вправо, при маленьком шрифте (отнимается меньше - отступ больше), если в выражении использовать пиксели, то элемент уйдёт вправо при большом шрифте (просто левый элемент увеличится). И в том, и в другом случае, для компенсации сдвига вправо, нужно сдвинуть элемент ВЛЕВО. Но сдвинуть не абсолютно, а при условии. Основные инструменты для сдвигов: марджины паддиги и бордеры прилежащих сторон элементов block-1 и block-center... Можно было бы как-то изловчится с паддингами (что-то вроде 15rem - 150px, положительное значение будет только при значении браузерного шрифта большего, чем по-умолчанию, значит только тогда он и начнёт работать), но паддинг может сдвинуть только вправо. Марджин может сдвинуть и туда и туда, но он безусловен, то есть, не может в одном случае сдвигать, а в другом - не сдвигать. Была идея как-то сделать, чтоб паддинг и марджин взаимно компенсировали друг друга, когда нам надо, а когда не нужно паддинг, стал меньше нуля, и исчез, но на практике мне не удалось это реализовать. В случае, когда отнимаем rem (в указанном выше коде), при нулевом font-size отступ максимален. Соответственно, сдвиг влево должен быть максимален и равняться ширине элемента block-1 в пикселях. Допустим ставим элементу block-center отрицательный левый марджин (или отрицательный правый марджин ставим block-1), сдвигая block-center на нужную величину, а, чтоб при увеличении шрифта отступ уменьшался, пишем block-1 {margin-right: calc(15rem - 150px)}, что при маленьких шрифтах будет сдвигать блок block-center влево, но при больших будет сдвигать вправо и как это компенсировать - не понятно. В случае, когда отнимаем px, при маленьких шрифтах всё хорошо, поскольку и block-1, и отступ - нужных размеров, но когда шрифт увеличивается, элемент block-1 увеличивается, а расстояние между блоками block-1 и block-center остаётся таким же, и опять-таки нужно каким-то образом компенсировать, а любой марджин - будет действовать в обе стороны, а паддинг - в одну, но только вправо, а мне нужно налево. В общем, не оставляют меня мысли, что тут можно применить какую-то хитрость и скомпенсировать увеличение отступа, при изменении шрифта, но что-то, как не изгаляюсь, паддинг сдвигает не туда, марджин сдвигает не только туда, но и не туда, при этом паддинг это "не туда" скомпенсировать не может, поскольку сам вылезает туда же, в "не туда"... Каким образом приручить эти элементы?

Для меню. http://htmlbook.ru/practical/nispadayushchee-menyu https://webref.ru/layout/html5-css3/list/use Вдохновившись, в своё время этим, ваяю многоуровневое адаптивное меню Спан (в оригинале блочная ссылка) и тень участвуют в наложении по z-плоскости и должны находиться на разных уровнях. Надеюсь, я это когда-нибудь доваяю, наберусь смелости, и выложу на суд общественности...

К сожалению, пока тоже работаю на ноуте. Но в своё время, вот в этой замечательной теме (прочитав вводную, перелистывайте на последнюю страницу), купил для ноута матрицу IPS (Москва, м. Маяковская), качеством доволен (наверное это максимум того, что из моего ноута можно было выжать, года два-три прошло уже - работает как родная, подсветка регулируется). Новая матрица должна быть относительно совместима со старой, лучше проконсультироваться в той же теме. Поменять матрицу можно, наверное и самому ну или договориться с ремонтниками, не думаю, что подобная процедура будет стоить дороже 1000ру. Поддерживаю идею покупать ноут с большим разрешением экраном. Но, как тут верно заметили, с матрицами для них сложнее, но заморочиться, наверное, стоит.

Почитайте.

Ну вот, в общем, получилось. С тенями, сложности, в основном, такие: При переходах, они исходят из, а не просто появляются, что, с одной стороны и логично и красиво, но поскольку тени мы применяем несколько не по назначению, нам это лишнее. Второе - когда мы используем тень внутрь (inset) они появляются/исчезают мгновенно. А поскольку этим свойством пользоваться, в некоторых случаях удобно, то обходиться без него - неудобно. В принципе, в моём примере, я мог все тени убрать с помощью прозрачности, кроме предпоследних полос, поскольку вместе с ними уберутся и последние полосы. Третье, тень повторяет форму элемента, из которого она исходит, поэтому приходится делить строго: один псевдоэлемент - прямоугольный, для формирования прямых полос, а второй псевдоэлемент - для формирования нужного контура самой тени, которая будет размерами, расположением и скруглением, такой как нам нужно.

Спасибо большое! Очень интересная идея. Сейчас подумаю, как её перелопатить для моего случая.

Вот иллюстрация. Тень должна исходить из выделенного блока(визуально, там видно откуда, и видно, что сейчас сделано криво). По-идее, это должен быть span, но в оригинальной задаче, span должен быть сам по себе, а тень должна исходить либо из самого пункта (класс every), либо из какого-либо нейтрального потомка, а какой потомок "нейтрален"? псевдоэлемент, его мы может подогнать под нужные размеры, поставить нужный z-index и сделать для него тень. Беда только в том, что для последнего элемента (крайнего справа), свободного псевдоэлемента не осталось. Что делать? Обязательно для всех меняющихся элементов, которые видны на иллюстрации, в том числе и для тени, нужен транзишн. Поэтому всевозможные изыски с градиентами проблематичны, поскольку напрямую градиент не транзитируется только через opacity. Но прозрачность меняется для всего элемента(псевдоэлемента) сразу, а значит скрывать полоски и показывать одновременно тень элемент не сможет. Были мысли также про какие-то изыски с границей, но опять-таки, двухцветную границу можно сделать только через border-image, а как плавно менять его прозрачность? (понятно, что если нам форма не важна, мы можем тупо сделать левую и правую границу и через opacity менять прозрачность элемента. Но нам же нужно чтоб этот элемент ещё показывал тень, поэтому нам важна как форма, так и прозрачность элемента и менять в угоду полосочкам ни то, ни другое, мы не можем. полосочки как-нибудь сами должны). В общем, нужно как-то поменять форму тени не трогая span, чтоб, при этом, её форма совпала со span и, для последнего элемента, оставить две пары, по две полосы, которые, независимо друг от друга, должны плавно уходить в прозрачность и выплывать из неё обратно. Благодраю за внимание, буду рад Вашим свежим идеям! ЗЫ: можно, ещё сделать две тени, но поскольку тень также нельзя увеличить только в одну какую-то сторону, то процесс подгонки тени (которая в разных браузерах, и рисуется всё-таки немного по разному), большая, отдельная, нудная тема, которую не хотелось бы открывать, лучше чтоб тень исходила из элемента совпадающего по форме с тем, из которого она исходит визуально. ЗЫЗЫ: чисто теоретически, для градиента можно сделать плавный переход, вот что сказано в спецификации: Но на практике у меня это не заработало. Может у кого-то заработает?

Проблема ступора, когда общая логика понятна, но не вполне понятно в какой ситуации какую логику применить. К тому же, описание этой логики на формальном языке даёт дополнительное препятствие, поскольку какие-то реальные задумки требуется адекватно формализовать, а связи между задачами, и адекватными им средствами языка, нет. В результате более-менее всё понятно, а что писать? Что необходимо? Что это даст? Адекватно ли это? Возможно ли то? И так далее... Хочется каких-то ориентиров. Попробуйте двигаться от простого к сложному, почитайте книжки с примерами, пробуйте решать задачи разными способами.

Вот, например, так, только с условиями, как в заголовке? ЗЫ: фигура должна заливаться градиентом и откидывать тень.

Ну, то есть, поскольку z-index у .mini::before, .mini::after и .mini span::after одинаковый, и все они лежат в одном контексте наложения .mini, то, приоритетом обладает то, что находится в коде ниже, верно? И, поскольку, правые полоски идут после span'а то они отображаются поверх него и, соответственно исчезают дольше. Значит надо полоски поставить в равное положение относительно фона, либо у обеих z-index должен быть больше span::after, либо меньше. Вы предложили поставить меньше, но, в принципе, подойдёт любая неравная пара (скажем у span::after z-index: -2, а у .mini::before, .mini::after z-index: -1). Главное чтоб z-index у них был не больше нуля, иначе фон или полоски будут поверх текста. Спасибо за замечание!

Столкнулся со следующим странным поведением. В хроме пока работает transition, фон просвечивает через border-radius (наведите на первый пункт). В Лисе градиент имеют такую особенность: полосочка 10px, полосочка 10px, прозрачность, на стыке второй полосочки и прозрачности образуется некий серый фон толщиной пикселя в два. Поскольку фон в примере двухнаправленный, то Вы, убрав одно направление (65 или 66 строчка, не забудте в конце оставленной строчки поставить точку с запятой ), можете увидеть что полоска есть только в том направлении, где нулевой переход из цвета в прозрачность. По обеим глюкам: что это? откуда это? куда писать? какие способы бороться? Спасибо за внимание