Search the Community
Showing results for tags 'epic fail'.
Found 2 results
-
http://jsfiddle.net/ogb7kbLw/ <!DOCTYPE HTML><html><head> <meta http-equiv="Content-Type" content="text/html; charset=windows-1251"> <title></title><STYLE>.button-master {border: 1px solid #000;padding: 2px; /* вопрос б *///float: left; /* вопрос в */} .button-slave {padding: 2px;background: #aaa;font-size: 13px;font-weight: bold;border: 1px dashed #fff;color: #fff;}.canvas {display: inline;} canvas {//position: absolute; /* вопрос г *///float: left;}</STYLE></head><body><HEADER></HEADER><SECTION><NAV></NAV><ARTICLE><span class="button-master"><span class="button-slave">Элемент</span></span><div class="canvas"><canvas id="icon01" width="16" height="16" style="border:1px solid red;"></canvas></div><div class="canvas"><canvas id="icon02" width="16" height="16" style="border:1px solid green;"></canvas></div><div class="canvas"><canvas id="icon03" width="16" height="16" style="border:1px solid blue;"></canvas></div></ARTICLE></SECTION><FOOTER></FOOTER></body></html>Несколько вопросов вызывает данный код. а. Почему элементы изначально позиционированы не ровно, здесь какой тип элементов canvas или span не ровный по высоте? На jsfiddle они ровные, что странно, проверьте всё-же в IE. Далее по порядку, каждый вопрос это закомментированный в коде стиль, применяется только отдельно, но не все сразу. б. Для .button-master padding два пикселя. Почему если его закомментировать .button-slave по высоте выходит за границы родительского элемента .button-master? в. Почему если раскомментировать float для button-master тогда элементы все ровняются, но по верхнему краю? г. Почему если раскомментировать position для canvas, эти элементы ровняются по центру, что мне и нужнее всего. Но при этом они создают коллапс, все позиционируются в одно место, один в другой. Какое решение здесь можно применить? UPD. Определил способ позиционировать canvas. Установить для canvas position: relative; и далее позиционировать по высоте top; относительно родительского div. Но всё-же интересуют все соображения по вопросам.
-
Меня всегда раздражало, что изменения стилей в инспекторе хрома (на вкладке elements) не сохраняются на жесктй диск при использовании препроцессоров. Итак, воспользуемся препроцессором sass (в пререлиз версии 3.3+ есть замечательная штука sourcemaps) и след. инструкцией: http://www.hongkiat.com/blog/editing-css-preprocessor-chrome/ Что имеем в итоге: в инспекторе хрома (на вкладке elements) мы видим не скомпилированный css, а sass. И когда правим его - изменения тут же отражаются скомпилированном css-файле, НО...все это теряет обсолютно любой смысл, т.к. именения стилей в инспекторе хрома (на вкладке elements) НЕ отражаются на самом sass-файле, а только на скомпилированном css-фале, что является эпичнейшим фейлом. Кто уже поработал со всеми этими sourcemaps в sass, отпишитt пожалуйста, это действительно так неудобно и бессмыслено сделано, или я что-то делаю не так.
