psywalker
-
Posts
13,707 -
Joined
-
Last visited
-
Days Won
58
Content Type
Profiles
Forums
Calendar
Store
Everything posted by psywalker
-
SelenIT, Понял, спасибо ещё раз, теперь всё ясно.
-
SelenIT, Ясно, спасибо дружище. Жаль конечно. А почему тада опера это делает?
-
Почему? Хорошо же) Хоть как-то можно проблему решить. Т.е. псевдоэлементы тут только для Оперы сделаны, с помощью них можно наложить маску в виде пнг изображения с закругленными краями и эмулировать бордер-радиус. Т.к. остальные браузеры (не уверен на счет ИЕ9, сейчас сижу жду скриншоты с браузершота, т.к. там где я сейчас, он не установлен) псевдоэлемент прячут под img, то и лишнюю картинку не загружают, что есть хорошо (зачем нам лишние запросы?). Получился небольшой хак. Лично мне это может быть полезным. Я не спорю, что тут этот трюк приносит пользу. Но я возмущался именно из-за неработающих псевдоэлементов у картинки. Т.е. если, например возникнут другие задачи, где потребуется сделать псевдоэлементы у картинок, то мы не сможешь этого сделать. Вот, в чём беда. Судя по всему дело именно в этом. Когда я собирал тот вариант, тогда еще была привычка ставить префиксы, потому я не стал их ставить для вебкита и фф и успокоился. А оно оказывается вон че. Именно! Спасибо за пример. Но есть вопрос. Выходит, что псевдоэлементы у картинок не будут поддерживаться вообще? Даже в будущих версиях браузеров? Извиняюсь за некорректный вопрос.
-
да, этот. Там до безобразия все просто, через after накладывается тень поверх картинки и прячет ей углы. В Хроме и ФФ пример не работает просто потому, что я специально не написал префикс для box-shadow, поэтому там нет тени и "рамки". Как только эти браузеры начнут понимать свойство без префикса, все детали проявятся. Но к тому времени, думается, Опера уже пофиксит этот баг. Стоять! Я понимаю, что делает твой пример, НО погоди! Какие префиксы? box-shadow давно уже работает без них везде. Тут дело в другом. В самом :after у картинки, которое НЕ пашет в ФФ, Хроме и ИЕ9. Понял? Или это я гоню?
-
Макс, мой вариант отсюда http://forum.htmlbook.ru/index.php?showtopic=28923 , забыл уже что ли?) Вот этот? http://www.alpatriott.ru/works/primer/opera-radius.html Да, я помню, просто раньше не обращал внимание на афтер у картинки.
-
Для Хрома и ФФ - никакого Судя по всему они псевдоблок этот под img прячут всегда, но вот Опера обрабатывает как обычно... Понятно. Спасибо, но жаль конечно же.
-
Softlink, zSpx, Братва, а какой результат даёт :after, :before у ваших картинок? Вроде убираю их (Хром, ФФ), ничего не меняется.
-
Это же таблица как бы. Вот поэтому пункты и сужаются, если сужается меню. Как тебе этот вариант? <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Документ без названия</title> <style type="text/css"> * { margin: 0; padding: 0;} .headerMenu { background: #573810; width: 100%; list-style: none; -webkit-box-shadow: #231b10 1px 2px 3px; -moz-box-shadow: #231b10 1px 2px 3px; box-shadow: #231b10 1px 2px 3px; -webkit-border-radius: 8px; -moz-border-radius: 8px; border-radius: 8px; border-collapse: collapse; } .headerMenu:after { overflow: hidden; content: ''; display: block; clear: both; height: 0; } .headerMenu li { float: left; width: 14.2%; font: italic 18px Georgia, sans-serif; } .headerMenu li:hover { background: #b90202; background: -webkit-gradient(linear, 0 0, 0 bottom, from(#e80505), to(#9b0000)); background: -webkit-linear-gradient(#e80505, #9b0000); background: -moz-linear-gradient(#e80505, #9b0000); background: -ms-linear-gradient(#e80505, #9b0000); background: -o-linear-gradient(#e80505, #9b0000); background: linear-gradient(#e80505, #9b0000); } .headerMenu li:first-child { -webkit-border-top-left-radius: 8px; -webkit-border-bottom-left-radius: 8px; -moz-border-radius-topleft: 8px; -moz-border-radius-bottomleft: 8px; border-top-left-radius: 8px; border-bottom-left-radius: 8px; } .headerMenu li:last-child { -webkit-border-top-right-radius: 8px; -webkit-border-bottom-right-radius: 8px; -moz-border-radius-topright: 8px; -moz-border-radius-topright: 8px; border-top-right-radius: 8px; border-bottom-right-radius: 8px; } .headerMenu li a { background: url('../images/headerMenuLiBg.png') right top no-repeat; display: block; padding: 0px 0 0px; text-decoration: none; text-align: center; height:60px; color: #fff; } </style> </head> <body> <ul class="headerMenu" > <li><a href="" >Главная</a></li> <li><a href="" >Девушки</a></li> <li><a href="" >Стрип-клюбы</a></li> <li><a href="" >Сауны</a></li> <li><a href="" >Услуги</a></li> <li><a href="" >Массажистки</a></li> <li><a href="" >Добавить анкету</a></li> </ul>
-
Не то? <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Документ без названия</title> <style type="text/css"> .headerMenu { background: #573810; display: table; width: 100%; list-style: none; -webkit-box-shadow: #231b10 1px 2px 3px; -moz-box-shadow: #231b10 1px 2px 3px; box-shadow: #231b10 1px 2px 3px; -webkit-border-radius: 8px; -moz-border-radius: 8px; border-radius: 8px; border-collapse: collapse; } .headerMenu li { display: table-cell; width: 14.2%; font: italic 18px Georgia, sans-serif; } .headerMenu li:hover { background: #b90202; background: -webkit-gradient(linear, 0 0, 0 bottom, from(#e80505), to(#9b0000)); background: -webkit-linear-gradient(#e80505, #9b0000); background: -moz-linear-gradient(#e80505, #9b0000); background: -ms-linear-gradient(#e80505, #9b0000); background: -o-linear-gradient(#e80505, #9b0000); background: linear-gradient(#e80505, #9b0000); } .headerMenu li:first-child { -webkit-border-top-left-radius: 8px; -webkit-border-bottom-left-radius: 8px; -moz-border-radius-topleft: 8px; -moz-border-radius-bottomleft: 8px; border-top-left-radius: 8px; border-bottom-left-radius: 8px; } .headerMenu li:last-child { -webkit-border-top-right-radius: 8px; -webkit-border-bottom-right-radius: 8px; -moz-border-radius-topright: 8px; -moz-border-radius-topright: 8px; border-top-right-radius: 8px; border-bottom-right-radius: 8px; } .headerMenu li a { background: url('../images/headerMenuLiBg.png') right top no-repeat; display: block; padding: 0px 0 0px; text-decoration: none; text-align: center; color: #fff; } </style> </head> <body> <ul class="headerMenu" > <li><a href="" >Главная</a></li> <li><a href="" >Девушки</a></li> <li><a href="" >Стрип-клюбы</a></li> <li><a href="" >Сауны</a></li> <li><a href="" >Услуги</a></li> <li><a href="" >Массажистки</a></li> <li><a href="" >Добавить анкету</a></li> </ul>
-
А вот теперь, когда ты поменял код, уже выравнивается
-
display: table; - Значит уже растягивается, как таблица. Дели 100% на 7, и проставляй эту ширину пунктам.
-
А что именно смущает?
-
А с чего ты решил, что она должна выравниваться?
-
Vitaliy, План минимум http://forum.htmlbook.ru/index.php?showtopic=25566&st=0&p=191420entry191420
-
Так сделай их просто фоновыми картинками, через :before
-
Да ладно. Первый раз всего написала. Ладно, ладно, мы не кому не расскажем, что ты являешься агентом Opera Software
-
Странно, Сань. У меня не режет, на вин7
-
Заметили, что от поста к посту Оксана пишет одну и ту же фразу:
-
Можно в форме отключить "Enter" а именно в <input> ?
psywalker replied to Saturn's question in HTML Coding
Блиин, ну ты мастер. Просто всех Экспертов уделал одним махом Спасибо, позновательно -
Обратись ко-мне на почту. Разберёмся. psywalker09@gmail.com
-
Можно в форме отключить "Enter" а именно в <input> ?
psywalker replied to Saturn's question in HTML Coding
Кнопки сабмита нету? Да, но тут тоже нет. Но однако ж Энтер отправляет форму <form action="#" method="GET"> <fieldset> <input class="no-submit" type="text" name="sample" /> </fieldset> </form> -
Какие точки? Ты про маркеры что ли?
-
Можно в форме отключить "Enter" а именно в <input> ?
psywalker replied to Saturn's question in HTML Coding
Дружище, а объясни плиз, в чём тут прикол? Почему пашет? -
В ИЕ7 есть поддержка селекторы атрибутов.
-
Можно в форме отключить "Enter" а именно в <input> ?
psywalker replied to Saturn's question in HTML Coding
Не понимаю, кто мог тебе посоветовать такой код, из-за которого могут быть проблемы? Смотри, вот так хреново делать <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Документ без названия</title> </head> <body> <script type="text/javascript"> var inputs = document.getElementsByTagName('input'); if(inputs) {alert(1)} </script> </body> </html> if выдаст true;, даже не смотря на то, что input на странице НЕТ. Дело в том, что массивы и объекты, даже, если они пустые, равны true; Проверку нужно делать вот так: if(inputs.length) {alert(1)} Т.е. проверяем именно длину массива. На будущее. Не слушай тех, кто лезет туда, о чём представления не имеет.