RodgerFox

Очень жаль.... Большое всем спасибо. А если не трудно можно кусочек кода, который как раз будет добавлять класс при нажатии?

А еще можно без псевдоклассов сделать.

Что будет если не хватает места для блока с контактами? они должны наезжать на боковую колонку?

Блин, не то все... это все знаю. Вот пример, может так будет попонятнее, я плохо объясню все ~_~ <p><a href="#"></a></p> a:active {} + изменялся сам p т.е. при нажатии на ссылку меняется свойства у параграфа в котором находится ссылка p:active - не подходит. Возможно ли так сделать?

Привет, не мог бы ты помочь мне, пожалуйста. Меня часто волнует один вопрос про верстку и я даже не знаю где искать, что то находил но так же быстро терял. Я надеюсь ты сможешь прояснить мне мои пустоты. В систематике CSS есть такие хаки, на пример > [type=""] и т.д. Так вот что сейчас интересно, у тебя нету полного списка таких хаков? Все чаще начинаю их использовать, точнее уже повсеместно и кажется что их больше чем я знаю и второй самый интригующий меня вопрос. Есть на пример кнопка <p><input ../></p> на пример делаем эфект при клике input:active {...} как на ксс задать, что при нажатии на инпут параграфу выше задаем свои новый ксс свойства? решение такое есть? Пробовал решить специально созданную для этого задачу, выход - пришлось сильно поджимать параграф задавая ему тьму свойств, которые можно и обойти сделав элемент более "резиновым". link - http://jsfiddle.net/C5hWY/59/ p.s. хотел письмом отправить, но юзер игнорит мну TT

да не, header вообще другое, ну я его чаще использую только для блоков цельных. На пример блок товара. у него есть шапка, контент, доп. что то... во... чуть позже скину в личку делаю один интернет магазин. Там все сразу станет понятно

Да зачем хеадер? Красный див, зеленый убрать и все.

все верно кроме зеленого блока ну и теперь получается еще тега section =\

<section> <!-- тут или див или что захотите в нем находится лого и ссылки на авторизацию --> <nav><!-- наше меню большое --> <!-- какие ссылки тут будут? можно опять же использовать простой див. --> </section> Пример более подробный: <section> <nav class="menu2 float-r"><!-- идет список типа: <a href="#"></a><a.../> --></nav> <div class="logo float-l"><!-- лого + авторизация --></div> <nav> <!-- наше меню --></nav> float-r - float: left; float-r - float: right; Сначала правый ставится, а попробуйте поставить в конце поймете причину.

Да я не видел вообще то сообщение твоё про то, что не ко всем элементам можно добавлять. + я тогда сонный был. И я не видел в том посте 2 страницы, только сейчас заметил. Поэтому и не знал в полной мере.

up^^

Слушайте, я могу решить вашу проблему. Только напишите почему рекламные агенства представляют себя как Г.? Да я уверен, что вы из провинции, на пример, но это не значит, что это нормально. Каждый день моя поездка в университет это борьба самим с собой, так и хочется вырвать себе глаза. p.s. накипело.

Я тебе объяснял уже. Зря видимо старался, т.к. ты просто проигнорил. Не не не не не...я не видел 2 страницы в том топике) Нечего не зря, даже не думай так писать!

ну я как то начал догадываться про это, а можно ли заставить их работать так? Дело в том, что при нажатии на кончик, хотелось бы что бы он так же работал. т.е. происходило деяние!

Да все просто, представьте что вы решетка - # и действуйте, действуйте! HTML: <nav> <ul> <li>Лучшее <ul><li>link</li> <li>link</li> <li>link</li> </ul> </li><!-- end лучшее --> <li>новые <ul><li>link</li> <li>link</li> <li>link</li> </ul> </li><!-- end новые --> <li>добавить <ul><li>link</li> <li>link</li> <li>link</li> </ul> </li><!-- end добавить --> </ul> </nav> CSS: ul { text-align: center;} ul li {font-size: 16px; text-align: center; color: gold; float: left; display: block; width: 32%; margin-left: 2%; /* 32+32+2+2=100% */ } ul li:first-child {margin-left: 0px;} ul li ul {overflow: hidden;} ul li > li {float: left; color: #fff; font-size: 14px; float: none; width: auto; /* тут лучше заставить все элементы брать всю ширину которая им дается, если все фиксированно то еще легче. Не забывай, что дочерние элементы могут брать значения у родителя, их надо обнулять или менять на свои. */} палочки или при ксс делать, типа border или отдельные <li/>. Пример: <li>link</li> <li>|</li> <li>link</li> <li>|</li> <li>link</li> p.s. делал по этой картинке - ( _http://fotohost.org/images/a144826b-93kB.jpg ) Я кажется писал выше, сделайте последнее меню по правому краю, шапку с ссылками авторизации по левому, меню по центру. Аминь.

А чем плох список в список? И при чем тут header? не надо вставлять все знакомые вам блоки во все щели.

ul li > li {auto}

<nav> <ul> <li>Лучшее<ul><li>link</li><li>link</li><li>link</li></ul> <li>новые<ul><li>link</li><li>link</li><li>link</li></ul> <li>добавить<ul><li>link</li><li>link</li><li>link</li></ul> </li> </ul> </nav> вот и все По последней картинке: <section> <div class="logo + login" /> <!-- суда код выше с менюшкой --> </section>

Подскажите почему для input не работают псевдоклассы before/after???? http://jsfiddle.net/C5hWY/1/ если место инпута сделать ссылку <a> то все работает =\

Да, но это просто вообще под стиль не подходит весь) А так можно! Всем спасибо, пора уходить. Буду очень рад, за доработку кнопки, времени в обрез... и как всегда что то упускаю. Удачи >.<

Блин... ппц. Вот и спать не хочу и работать не могу, с полудня сижу верстаю. Ппц... понял в чем фишка. я использовать 2 показателя, top/right а ты еще 3 используешь. поэтому он у тебя не сжимается... ОМГшечки... Если ты в таком хорошем расположении, подскажи плз еще одну вещь. Вот знаю как делать но не работает =D —--\ \ / —--/ типа, есть у нас прямоугольник. ссылка, кнопка, не важно. добавляем к ней: :before { content:""; position: absolute; right: 100%; top: 26px; width: 0; height: 0; border-top: 13px solid transparent; border-right: 26px solid red; border-bottom: 13px solid transparent; } и не пашет... почему???? скравтил пример: http://jsfiddle.net/VDPsY/19/

псевдоклассы before/after должны быть под главным блоком. с фоном тем же и бордюром. если добавить фон и z-index увидишь, что все равно бордюр накладывается на основной блок. не пойму почему, но так получается. Из-за этого не вариант.

Ну не просто рядом, они должны брать высоту и ширину главного элемента, иначе листы будут не реалистичны. да думаю сейчас лучший способ. Ибо может понадобится микротени и т.п. Но может есть лучше вариант) Если не понял, то да хочу что бы другие блоки применяли высоту и ширину такую же и становились под ним.

http://jsfiddle.net/VDPsY/2/

Какой js? Ты походу спишь в одном ботинке, правда) Вот весь код: .block { position: relative; border: 1px solid #000; width: 200px; } .block:after { position: absolute; width: 100%; top: 20px; bottom: -20px; right: -20px; border: 1px solid red; content: ''; } Я так наал делать с самого начала, но почему то не получилось. Первый способ писал. Странно почему так, тупо не отображаются не один афте или бифо. Почему так может быть? Создал и новый документ все заново, бесполезно! Куда копать? Потому что ты ставил высоту псевдоэлементам в процентах, которую им неоткуда было высчитывать. А я сделал через смещения: top, bottom. Просекаешь?) Главный блок должен быть резиновым. А он ща какой по высоте по твоему?) не помню ссылку на сервис что бы показать код. Вставьте в блок типа этого: <h2>Детали заказа</h2> <time>время</time> <p>Текстовое поле</p> <p>Текстовое поле</p> <p>Текстовое поле</p> <p>Текстовое поле</p> и уменьшите расстояние, на пример, на 3px, заполните фоном и блок и пседво, и посмотрите что за бред получится. НУ и попробовать исправить при помощи z-index.