Меню с беграундом по одну сторону

[npofopr]

Подскажите, можно чисто теоретически.
Как делают такие меню?

Центрированное меню с беграундом и с левой стороны беграунд меню уходит в "бесконечность и далее". Т.е. продолжается до конца окна браузера.
А справа обрезается по последнему пункту.

Сам сайт фикс. 900px.

Можно вот так: http://jsfiddle.net/npofopr/Ue8hk/ но не совсем кошерно, и градиент не наложить(

 

[Сергей2]

задай в style.css
/* CSS Document */
*{
padding:0; margin:0 auto;
}
body{
position:relative;
{
А в класе например
.seach{
position:absolute;
bottom: 1opx;
left: 30px;
}

 

[npofopr]

задай в style.css
/* CSS Document */
*{
padding:0; margin:0 auto;
}
body{
position:relative;
{
А в класе например
.seach{
position:absolute;
bottom: 1opx;
left: 30px;
}

вы вообще читали тему?

 

[BaNru]

Пока читал пост, в голову пришел вариант примерно такой же, как реализовал ты - через псевдоэлементы.

Второй вариант, ещё "менее кошерный", высчитать padding-left с помощью CALC :biggrin:

 

[npofopr]

Пока читал пост, в голову пришел вариант примерно такой же, как реализовал ты - через псевдоэлементы.

Второй вариант, ещё "менее кошерный", высчитать padding-left с помощью CALC :biggrin:

вот только градиент там не задать

 

[BaNru]

вот только градиент там не задать

высчитать padding-left с помощью CALC :biggrin:

 

[npofopr]

вот только градиент там не задать

высчитать padding-left с помощью CALC :biggrin:

Слишком уж мало поддерживаемый этот CALC

 

[BaNru]

Ну почему же мало?
Хром 19+
ОгнеЛис 4+
Осел 9+
Только Сафри и Опера последние (6 и 15)

Думаю процентов 80 набирается


Еще есть вариант попробовать:
- либо через таблицы (в т.ч. псевдотаблицы),
- либо через вложения (в принципе одно и тоже, что и таблицы)

 

[npofopr]

А в таблицы тоже наверно градиент не получится наложить.

 

[BaNru]

Как-то так
(сделано под ОгнеЛиса)

 

[CamaroSS]

Я только не понял, слева фон обрезается враппером?

А так вот вариант. Картинка - первый попавшийся градиент. Костыликов добавить по вкусу.

 

[npofopr]

Я только не понял, слева фон обрезается враппером?

А так вот вариант. Картинка - первый попавшийся градиент. Костыликов добавить по вкусу.

Не правильно поняли. Там же есть картинка, как это должно быть.

 

[CamaroSS]

А, тогда чё мелочиться :laugh: . Линк.
Вроде все понимают без костылей, кроме IE 7 и ниже.

 

[npofopr]

А, тогда чё мелочиться :laugh: . Линк.
Вроде все понимают без костылей, кроме IE 7 и ниже.

scroll в бесконечность и далее

 

[CamaroSS]

Без тебя бы и не заметил... можно заабсолютить в контейнер с фиксированной высотой. Больше css-идей пока нет))

 

[mrlasking]

[member=npofopr], Подойдет? http://jsfiddle.net/mrlasking/7XNKZ/