bob_24

ablay2009, спасибо за внимание, но вы пишите, мягко говоря, не правильные вещи. K313, что-то кроме map можете посоветовать? map, как я понял, только к картинкам цепляется?

С фоном я разобрался, он меняется не так. Окантовка или как это правильно называется:

вот тут хороший способ описан делать круглые/скругленные картинки

Нужно сделать как на картинке: Делаю так: <a href="#" class="item">Пункт 1</a> .item{ display: block; position: relative; height:30px; width:130px; line-height:30px; text-align:center; text-transform:uppercase; color:#fff; background-color: #f00; } .item:before{ content:''; position: absolute; left:0; top:0; border-left:15px solid #fff; border-top:15px solid transparent; border-bottom:15px solid transparent; } .item:after{ content:''; position: absolute; left:100%; top:0; border-left:15px solid #f00; border-top:15px solid transparent; border-bottom:15px solid transparent; } .item:hover{ background-color: orange; } Ссылка получается, но: как видно кликабельна и область псевдо-элементов (где он прямоугольник образует), хотелось бы, что бы кликабельна была только красная область, возможно такое сделать? И скажите, как избавится от этой странной окантовки справа от треугольника...

Squidward, как вариант левым блокам задавать класс с float:left, правым - float:right...

Может проще ссылки отделить от картинки? Картинку сделать фоном, а кнопки вырезать и сделать как простые ссылки, ну и абсолютно подвигать.

Проще добавить всем трем колонкам padding-bottom:32767px; margin-bottom:-32767px; и картинку с тенью зарепитить по y

.

.

.

.

http://jsfiddle.net/rRw9x/29/

Высоту ведь ты точную не будешь задавать, например для menu? Если сохранить такую разметку, то думаю ни как не сделать. float грубо говорят ограничивается по горизонтали блоком-родителем (у тебя это body), а по вертикали строкой в которой находится. Вот после content, так сказать, начинается новая строка и float выше нее не поднимется сам по себе.

Для ul.navmenu задай z-index больше чем у .bottom-mask

качать врядли кто будет, для этого есть jsfiddle.net/ что за странное св-во disaply ) а вообще у вас все работает http://jsfiddle.net/93xHH/

Может лучше css вынести в отдельные классы и использовать toggleClass ?

Собственно тема и состоит в том что бы узнать эти подходы. Если, конечно, это не секретные разработки.)

Softlink, спасибо. Знал что это будет первым ответом, но думаю эта система избыточна для небольших сайтов. Да и, если честно, трудновата пока для меня. А сами Вы ей пользуетесь?

Очевидно, что многие элементы (меню, логотип и т.д.) часто однотипны от сайта к сайту. Встал вопрос как организовать процесс быстрой верстки таких элементов. Хотелось бы почитать кто как решает этот вопрос, может кто даст дельный совет.

Спасибо, добрый человек ^^

http://jsfiddle.net/qr9Xf/ так?

Нужно сделать как на картинке: На всем сайте очень много горизонтальных линий (нарисована красным). Они должны быть по всей ширине блока. Но если линия оказывается рядом с картинкой (с float:left/right) она должна по ширине доходить только до картинки (+ ее margin). А получается так что линия растягивается на всю ширину и залазиет под картинку. Линия сделана div`ом: .line { height:1px; margin:22px 0 26px 0; background:#c7c7c7; border-bottom:1px solid #fff; } Если сделать <hr> вместо div, то линия ведет себя нормально, но там другие проблемы, поэтому <hr> не подходит. Скажите, можно ли так вообще сделать, и если можно то как?

Думаю да

На сервере каком пробуете или нет? У меня вне сервера такая же проблема. Залил, стало все хорошо. Почему не понял, но заморачиваться не стал раз работает.

rookie, объясни что там написано, пожалуйста? Столкнулся с той же проблемой, но не знаю как решить, кроме как добавлять отдельно блок c clear