Evkaky

Как сделать гугл мапсе скругленные уголки? Что я только не делал. Ничего не помогает. Почему такое вообще происходит, что на контейнере с гугл-картой не работает border-radius? http://jsfiddle.net/Hu3SK/

Меня всегда раздражало, что изменения стилей в инспекторе хрома (на вкладке elements) не сохраняются на жесктй диск при использовании препроцессоров. Итак, воспользуемся препроцессором sass (в пререлиз версии 3.3+ есть замечательная штука sourcemaps) и след. инструкцией: http://www.hongkiat.com/blog/editing-css-preprocessor-chrome/ Что имеем в итоге: в инспекторе хрома (на вкладке elements) мы видим не скомпилированный css, а sass. И когда правим его - изменения тут же отражаются скомпилированном css-файле, НО...все это теряет обсолютно любой смысл, т.к. именения стилей в инспекторе хрома (на вкладке elements) НЕ отражаются на самом sass-файле, а только на скомпилированном css-фале, что является эпичнейшим фейлом. Кто уже поработал со всеми этими sourcemaps в sass, отпишитt пожалуйста, это действительно так неудобно и бессмыслено сделано, или я что-то делаю не так.

Собсно, сабж, можно ли на ::before и ::after как-то воздействовать в js (навесить обработчик, добавить стилей/класс)? Мне кажется, что нет, ибо в их DOM-дереве невидно даже.

Да, похоже, но при таком подходе появляются след. пробемы (которых нету при использовании <table>): 1) ховер на строках одной строчкой цсс уже не сделать. Мне кажется, через цсс его вообще тут не сделать, только жсом 2) стандартный функционал столбца в таблице, т.е. ширина всех ячеек в конкретном столбце будет тянуться в зависимости от ширины ячейчки с самым длинным контентом

Благодарю, вариант с дополнительным дивом внутри ячеек и манипуляции именно с этими дивами - работает! Ну обновить браузер - это пару щелчков мышью, так что да, выкидываем их на свалку к ИЕ6, ИЕ5!

Уже нет. Да и зачем они, если есть флексбокс? overflow: hidden мне мешать будет, а прописывать каждому контейнеру с флоатом псевдоэлемент с clear: both - не торт. Вы пролейте свет на описанные мною проблемы с таблицей, может все-таки возможно в ней делать такие трюки со столбцами?

Задача: представить текстовые данные в табличном виде. НО. У каждой колонки в таблице должна быть возможность сплюснуться по ширине в 0, даже не сплюснуться, а как бы уехать (т.е должна быть анимция) в сторону (допустим, влево) под соседнюю колонку, спрятаться под нее. И соответственно, все колонки идущие после той, которую мы только что скрыли - подъедут влево и займут ее место, дабы не образовывать дырку в таблице. Что-то я начал приходить к выводу, что верстая все это дело на <table> будет невозможно создать эффект выежания/заежания колонки под близ стоящую колонку. В таблице даже невозможно просто сплюснуть ширину <td> в 0, если в этой ячейке есть контент. Ширина тупо упрется так, что бы вместить весь контент, и ни на пх меньше не станет, что бы я там не задавал ей в цсс. table-layout: fixed никак не помогает тут. В общем, с учетом всего вышеперечисленного, мне кажется, что лучше всего будет сверстать это дело на флексбоксах, как думаете?

Как только прописываю таблице border-collapse: collapse перестает работать border-radius у лиюбого элемента таблцы, хоть у table, хоть у <td> Убираю border-collapse: collapse - но тогда появляется геморрой с рамками внутри таблицы, они удваиваются, что в общем-то логично. Как застваить работать border-radius на таблице при border-collapse: collapse?

Есть простая структура таблицы. Извесно, что я легко могу управлять стилями конкретной строки, допустим, класс навесить на нужный мне <tr> и все. А можно так же лего управлять стилями для конкретного столбца? В таблицах сущность "столбец" не предусмотрена, на сколько я знаю. Вместо него есть сущность "ячейка" (тобишь, <td>) в строке. Если у меня с десятка строк, то прописывать класс в каждом втором <td> каждого <tr> (если мне нужен второй столбец, допустим) как-то не комильфо. Есть выход?

ИМХО, полезного в бутстрапе мало. В любом случае тебе придется переписывать бутстраповские стили для кнопок, форм, таблиц итд для любого конкретного дизайна (ну разве что дизайн сайта - это дефолтные стили бутстрапа, но никто не делает так). Сетки использовать не актуально, сейчас flexbox + препроцессор - и ты легко и быстро создаешь нужный тебе каркас. Сетки на флоатах (из бутстрапа или его аналога) не дают такой гибкости. Единственное, что я для себя почерпнул в твиттер-бутстрапе - это структура/ организация scss-файлов.

Действительно) Спасибо)

Есть большой элемент, скажем с классом "ololo". У него есть маленький псевдоэлемент. Нужно управлять стилями псевдоэлемента при ховере элемента "ololo". Т.е. имеем: .ololo { some styles } ololo::after { some another styles } Нужно что-то типа такого: .ololo:hover ::after { .... } Но этот вариант селектора не рабочий. Каким должен быть селектор? Или с использованием псевдоэлемента это не возможно?

О, то, что нужно, спасибо) P.S жаль, что вы уже ничего не пишете в css-live

Я, видимо не до конца описал свой случай. Я разноцветную рамку хочу замутить на одном ребре элемента, скажем, только нижнюю. Т.е. ваш варинат мне не подойдет, т.к. outline на все стороны полезет. Если бы можно было как-то так: border-bottom: 1px solid red outline-bottom: 1px solid blue

Кто знает, можно ли так сделать: у элемента есть рамка скажем в 2 пикселя...и вот я хочу что бы первый слой толщиной в 1 пиксель был одного цвета, а второй слой (он тоже толщиной в 1 пх) - был другого цвета ?

Только узнал, что у этого тега есть свойство type, у которого может быть значение submit. Отсюда вопрос: чем отличется <input type="submit" value="ololo"> от <button type="submit">ololo</button> На сколько я знаю, у обоих по умолчанию display:inline-block. И оба этих варианта будут тправлять данные на сервер, если заключены в тег <form>

http://jsfiddle.net/pbhAb/ Кнопка сохранить. Когда я ее делаю в виде <button class="popup_confirm">Сохранить</button>, то выглядела по размерам так же, как и кнопка "отменить" Но когда я ее переделал на <input type="submit" class="popup_confirm" value="Сохранить"> - она тут же скукожилась. Такое впечатление, что line-height перестал работать Почему так?

Сверстал попап http://jsfiddle.net/pbhAb/ Делаю так: затемняющая подложка <div class="popup_overlay"> и внутри нее сам попап <div class="popup"> В итоге, подложка, почему-то затемняет мой попап, но по логие это не возможно. У подложки z-index: 100, а у попапа z-index: 101. Если подложку и попап сделать элемнтами-соседями, то тогда всё в порядке <div class="popup_overlay"></div> <div class="popup"></div> 1) Почему это происходит? 2) Зачем вы поставили дефолтный скин ИПБ? Он ведь не торт(

Тоже пришёл к такому выводу. Это же и объясняет странные вещи при наследовании text-decoration. Оно наследуется...но только не для ссылок <a>. Как раз из-за того, что у них прописан свой, дефолтный text-decoration, который никакое наследование не сможет перебить

Не в обиду тебе, но дизайн как на сайтах начала 2000-ых годов. И если ты используешь хтмл5, то <div align="left" style="width:250px;"> - не очень хорошая практика.

На помощь

А тут пишут, что наследуется... http://htmlbook.ru/css/list-style Тут вообще маркеров нету по умолчанию http://jsfiddle.net/jKedb/ С ума сойти, ну... Ладно, прописываю у себя в боди list-style: none; <ul id="ololosh"> <li>1</li> <li> <ul> <li>111</li> <li>222</li> </ul> </li> <li>3</li> </ul> Маркеры есть для обоих списков!!! Прописываю #ololosh { list-style: none; } Для внешнего <ul> они пропали, а для внутреннего остались. Получается, не наследуется он...

А есть еще теги с таким не странным поведением? Я слышал, что в тегах <h1>...<h6> внутри не может быть других блочных тегов. Только что проверил - могут.

Нежданчик. Получается, внутри тега <p> могут быть только текст и элементы, которые строчные (display: inline) по своей природе. Т.е. нельзя сделать, допустим h1 строчным, через display: inline и засунуть его внутрь <p>. Даже строчно-блочне элементы внутрь <p> нельзя пихать. А есть еще такие теги-сюрпризы, которые по своей природе блочные (как и <p>) но внутри них тоже не будут отображаться другие блочные, строчно-блочные эелементы, даже если им прописать display: inline ?

<div id="wrap" style="width: 300px; height: 300px; background-color: #3366CC; margin-top: 50px; position: relative;"> <div id="rect" style="width: 50px; height: 50px; background-color: red; position: absolute; top: 0; left: 0;"></div> </div>