-
Posts
16 -
Joined
-
Last visited
Content Type
Profiles
Forums
Calendar
Store
Everything posted by DarkTranquillity
-
Выравнивание :before по центру в IE
DarkTranquillity replied to DarkTranquillity's question in HTML Coding
Вроде как решается добавлением left: 50%;Но я использую CMS и там для трех блоков, идущих друг за другом, применяю класс псевдотега, и после добавления left: 50%; - вместо трех треугольничков - остается только один. -
Доброго времени суток. Подскажите, как решить задачу в IE. Вот ссылка: http://codepen.io/anon/pen/uzHfb - footer с треугольником на CSS3 через псевдотег :before. В Firefox и Chrome под Win7 - всё ок, треугольник по центру, а в IE11 (в младших тоже наверное) - треугольник смещен влево. Та же история (смещен влево) и в Chrome на Android. Заранее благодарю за помощь.
-
Добрового времени суток. Подскажите, как для тэга img в CSS задать правило сохранения пропорций (аналогично как background-size: cover;). У меня вот следующая конструкция: .img-intro-left{ float: left; border: 3px solid #FCBF66; margin-right: 15px;}.img-intro-left img{ width: 150px; height: 150px;}Но при определенных размерах ширины и высоты изображения - оно естественно искажается. Возможно ли это реализовать на CSS? Заранее благодарю за подсказки
-
DIV конструкция с треугольником на CSS3
DarkTranquillity replied to DarkTranquillity's question in HTML Coding
Спасибо за подсказку - помогло Вот только в Opera по-прежнему зазор... Вот думаю, стоит ли вообще в таких случаях делать на CSS3, если есть возможность вставить просто бэкграунд изображение весом в пару килобайт. Зазор решил через сдвиг псевдоблока на -1 пиксель влево. -
Здравствуйте. Создал на CSS3 небольшую конструкцию: http://jsfiddle.net/R6ynT/ Линия 100%, под ней два блока пл 50% и у одного из них прилеплен треугольник через псевдотэг. В FireFox отображается хорошо, а вот в Chrome и Opera - по-разному. В Chrome треугольник сдвигается на пиксель вверх. В Opera появляется просвет между треугольником и левым блоком. Подскажите, пожалуйста, можно ли решить эту задачу кроссплатформенно? Заранее благодраю за подсказки.
-
Здравствуйте. Хочу решить задачу, решение которой вижу в табличном варианте: таблица из трёх колонок (первая 540px, вторая 200px, третья 200px) Как реализовать через DIV блочную вёрстку? Заранее очень благодарен.
-
Здравствуйте. Помогите, пожалуйста, решить вопрос: есть меню с псевдоклассами .a.link, a.active и a.hover. Для каждого псевдокласса свои цвета текста (link чёрный, hover чёрный, active синий). Задача: сделать active при наведении (при hover т.е.) синим (т.е. просто hover ссылки должны быть чёрным, но active hover синим). Активный пункт меню: ul.sd-hmenu>li>a.active { color: #0D6EAB; } Как решить вопрос выше? Пробую перечислением: ul.sd-hmenu>li>a.active, .sd-hmenu>li>a.hover { color: #0D6EAB; } В чём ошибка?
-
Фоновое изображение по краям монитора
DarkTranquillity replied to DarkTranquillity's question in HTML Coding
Спасибо всем за помощь, сделал 8 блоков. з.ы. в body у меня уже имеется фоновая текстура, помимо рамок... поэтому вариант в блоками подошёл больше. -
Здравствуйте. Не могу решить задачу: есть декоративная рамка, её нужно пустить (с повторением естественно) по краям монитора (вне зависимости от разрешения...). Вопрос: возможно ли это реализовать средствами CSS 2.x? Или только через CSS3 путём добавления нескольких фоновых изображений? Я это вижу так, что нужно пустить 4 фоновых элементов рамки (сверху, справа, слева, снизу с соответствующим репитом для каждого). При этом ещё долэны быть углы рамки в виде декоративных квадратов - их просто раскидать по 4 углам. Подскажите, может есть какие-то ещё варианты? И правильно ли я рассуждаю? Заранее благодарю за подсказки.
-
Баг верстки. При чем тут джумла? Ну потому что странно, что везде всё нормально, даже в ИЕ7-8, а в ИЕ9 баг. Вот и хочется разобраться, чтобы записать себе его в коллекцию. Я покапался глубже и выяснилось, что модуле (слайдшоу) для джумлы, который у меня был установлен в той позиции, есть отдельный css, правка которого решила проблему. Вернее даже и проблемы не было, вышел оптический обман. Во всех браузерах по краям при помощи css была поставлена тень, а IE её наверное не понимает, а без этой тени складывалось такое впечатление, что модуль смещён.
-
Хаки? Да... А надо было в HTML? В любом случаи -помола звёздочка в CSS.
-
Сделал по указанному примеру: .slideshow { width: 345px; height: 217px; float: left; position: absolute; top: 140px; left: 515px; } <!--[if lte IE 9]> .slideshow { width: 345px; height: 217px; float: left; position: absolute; top: 140px; left: 500px; } <![endif]--> на странице полный хаус случился.... Решил проблему подставлением звездочки... .slideshow { width: 345px; height: 217px; float: left; position: absolute; top: 140px; left: 515px; *left: 500px; }
-
Здравствуйте. Доделываю шаблон для Joomla 1.5, создал несколько позиций для модулей - во всех браузерах отображается нормально, а в IE9 один из модулей смещён вправо. в css: .slideshow { padding: 0px; float: left; position: absolute; top: 140px; left: 515px; } Раньше использовал в таких случаях хак: /* *+ HTML .slideshow { left: 490px; } /* IE7 */ Но в девятом осле это почему-то не работает... как с ним быть (с 9-ым ие)? Какой хак можно юзать? Или как для него отдельный CSS сделать (обычно всегда хаками обходился)?
-
Поомогите "допилить" меню на спрайтах
DarkTranquillity replied to DarkTranquillity's question in HTML Coding
Что-то я в прошлый раз не так сделал... сейчас переправил стили с чистого листа и всё получилось. Результат такой: http://s53.radikal.ru/i139/1106/a0/dd200c9ec074.jpg чего и нужно было добиться. Спасибо всем за отзывчивость! -
Поомогите "допилить" меню на спрайтах
DarkTranquillity replied to DarkTranquillity's question in HTML Coding
Ну вот я сделал так: #menu li{ overflow:hidden; text-indent:-9999px; display:inline; float:left; margin-right:10px; } Написал #menu li{ margin-right: 10px; overflow: hidden; padding-bottom: 30px; text-align: center; line-height: 130px; display: inline; } В этом случаи текст появился под кнопками, но само меню стало вертикальным, т.к. пришлось убрать display:inline; , а если его оставлять, то получается вообще какая-то "каша".... Как быть? Как сделать при применённых стилях что бы меню оставалось горизонтальным? -
Доброго времени суток. Хочу сделать меню на спрайтах, которое состоит из изображения (иконки) и текста (текст под иконками). Нашёл пример создания тут: http://ruseller.com/lessons.php?rub=29&id=523 Сделал - всё ок, за исключением одного важного для меня нюанса. Мне нужно, что бы под изображением был и текст меню (в виде текста, а не изображения естественно), в данном примере этот текст вынесен за пределы экрана так: text-indent:-9999px; Значение -9999px я убираю на "0" и текст размещается поверх графической части кнопки, а мне нужно спустить его под изображение. Что только не пробовал - не выходит... подскажите, пожалуйста, как это реализовать? Можно на другом примере или ссылку на соответствующий материал... Моя задача: меню в виде иконок под которыми название пункта меню. Неактивный пункт серого цвета (изображение и текст). а при наведении (независимо, на текст иди изображение) спрайт меняется на цветную часть иконки и текст так же меняет цвет. Заранее благодарю за любую помощь и подсказки.