leoni4
-
Posts
16 -
Joined
-
Last visited
Content Type
Profiles
Forums
Calendar
Store
Posts posted by leoni4
-
-
Давно хотел поиздеваться над IE (очень советую взглянуть в 8IE )
А тут заодно и конкурс
-
Не нашел темы <<Для работ "Сады Семирамиды">>
-
Я валяюсь!.. Вот во что превращается идея следовать самым новым веяниям в развитии html/css... 12-ая то откуда? Разработчиков хотите удивить!
Как бы 12-я в бете уже есть. А разработчики в свою очередь заявляют, что некоторые баги (на css3) будут поправлены. По большому счету это указано с тем умыслом, что некоторые свойства могут не работать в опере 11.52, например, но это будет не критично для конкурса.
Не согласен, только в 12 опере введут радиальный градиент, для рисования в цсс3 это очень(!) критично.
-
У всех конкурентов одна проблема - выпадающий лист фиксирован по высоте
в моем случае, этого удалось избежать.
На самом деле у вас не одинаковое отображение для ИЕ678 и всем остальными, я имею ввиду обновленную ссылку
У вас в адекватных браузерах:
во первых, при актиивном меню, фон зеленый
во вторых, при нажатии на элемент подменю, все подменю скрывается
В не адекватных, это не работает
И это с использованием скриптов? Без скриптов можно сделать нормально выпадение для всех браузеров используя :hover, :focus и:active
Ну если уж вам так принципиально :target то пожалуйста...
И еще у "конкурентов" фиксированная высота ставится в 99% случаев только для того, чтобы работали css transition
Если у вас этого не требуется то в коде конкурентов меняем height: 100px; на height: auto; и идем праздновать.
-
Вобщем, Влад тут как тут, так что просто дополню его ответ
Вам нужно поместить ссылку(значек поиска), рядом с инпутом, и все это дело обернуть в див
потом диву ставим стили от инпута, а сам инпут делаем прозрачным, и убераем бордеры
что- то вроде этого
<style type="text/css">
.textBox {
background: #ededed;
border: 1px solid;
border-color: #666 #aaa #aaa #666;
}
.textBox input {
background: transparent;
border: none;
}
a.search {
background: url('/картинка');
}
</style>
<div class="textBox">
<input type="text" />
<a class="search"></a>
</div>- 1
-
Да все делается средствами css
Обратите внимание на
эти значения,
@media screen and (max-width: 1160px ) {}
@media screen and (min-width: 1160px) {}в этих значениях вы ставите ширину окна браузера(!), а не контейнера
первое значение для окна меньшего чем 1160px, второе для большего
просто с первого раза это довольно сложно разобраться, сделайте несколько ошибок, подставляйте разные значения
в конечном итоге все будет работать как надо!
-
У меня к сожалению последняя ссылка не перепрыгивает на вторую строчку
у меня широкоэкранка 17" менял от 1440*900, до 800*600
-
Интернет-то там я думаю есть, но вот возможности вопользоваться им мне врядли представится
Ладно, на конкурс верстки хоть попадаю
-
Здравствуйте, вот ссылка на готовый пример
Вам, конечно, нужно будет подобрать ваши параметры ширины, и высоты
И не забудьте добавить лекарство для нашего любимого браузера
<!--[if lt IE 9]>
<script src="http://css3-mediaqueries-js.googlecode.com/svn/trunk/css3-mediaqueries.js"></script>
<![endif]-->PS: незнаю почему, но в "коде", почему-то он обрезает .js на следущую строку, так быть не должно
-
position: absolute;
top: -9999px;
left: -9999px;Если я вас правильно понял
-
Отлично блин, я как раз в это время буду за границей :\
Влад, а есть вариант вне очереди?) Или до 5-го у тебя совсем нет времени на подготовку задания?
-
Gaspode, если не брать в расчет ие 5-8 возможно
Softlink, в вашем варианте плохо что когда ширина больше 1200, мы не видим эелемнты, только при увелечении 1300+ их становится видно
По теме, вот в этом примере я показал как это можно сделать
Есть еще статьи влада на эту тему, поисчите не ленитесь
Я бы вам расписал, но у меня сегодня на работе завал
-
Ненавижу таблицы
но на вашем месте сделал бы вот так
<!DOCTYPE html>
<html>
<head>
<style>
body, body td {
margin:1px;
padding:1px;
font:normal 11px Tahoma, Arial;
border:1px solid #cccccc;
}
.mc {
border:1px solid #cccccc;
width:300px;
height:200px;
margin:1px;
padding:1px;
float:left;
}
@media screen and (min-width: 640px) {
#tdm1 {
width: 306px;
}
}
@media screen and (min-width: 1160px) {
#tdm1 {
width: 612px;
}
}
</style>
</head>
<body onLoad="ArrangeCats()" onResize="ArrangeCats()">
<div align="center">
<table>
<tr>
<td style="width:250px;vertical-align:top">FIRST COLUMN</td>
<td valign="top" id="tdm1">
SECOND COLUMN
<div>
<div id="mc1" class="mc">FIRST BLOCK</div>
<div id="mc2" class="mc">SECOND BLOCK</div>
<div id="mc3" class="mc">THIRD BLOCK</div>
<div id="mc4" class="mc">FOURTH BLOCK</div>
<div id="mc5" class="mc">FIFTH BLOCK</div>
</div>
</td>
<td style="width:250px;vertical-align:top">THIRD COLUMN</td>
</tr>
</table>
</div>
</body>
</html>Великие ie 6-8 не поддерживают media-query, нужно сделать вот так:
<!--[if lt IE 9]>
<script src="http://css3-mediaqueries-js.googlecode.com/svn/trunk/css3-mediaqueries.js"></script>
<![endif]-->и использовать вот этот скрипт
PS я использовал # в css только потому что не хотел менять ваш код, а вообще лучше конечно же классы
PSS и еще кое что, я догадался что скорее всего на вашем живом примере доктайп существует) но не ленитесь его писать, особенно если дело касается html5, уж очень он красивый
и абсолютно все атрибуты в разметке должны быть в двойных кавычках, я про ваше valign=top.
-
Это была одной из задач мини-конкурса, привлечь новичков на форум. Хорошо, что приняли участие новые люди.
Vlad, я сразу так и понял
Вообще сайтом/форумом пользуюсь, около полутора года.
С легкой руки моего знакомого, который сказал: "Хочешь изучать веб? Добавь этот сайт в закладки"
Но в основном, все проблемы уже решены заранее, поэтому регистрироваться руки не доходили)
-
Работы на конкурс Сады Семирамиды
in Contests
Posted
Странно, я думал что самое главное соблюсти условия:
?Минимальный размер картинки 800х600 пикселов, допустимо сделать её масштабируемой в зависимости от размеров окна браузера.
?В процессе работы нельзя использовать любые изображения (включая base64), SVG, VML, скрипты, библиотеки и тому подобное. Фактически должен быть только HTML и CSS.
?Работа должна корректно отображаться в современных браузерах Firefox 6+, Chrome 13+, Safari 5.1, Opera 12, IE10 (т.е. фильтры можно не включать).
Думал "Сады Семирамиды", просто название конкурса
То есть что именно изображать на рисунке не важно, а тут оказывается именно сады нарисовать нужно было :\
Жаль...