ФорумРазработкаКлиентская сторонаВерстка и оформление → Верстка с градиентом

Верстка с градиентом

  • mario

    Сообщения: 6067 Репутация: N Группа: Джедаи

    Spritz 27 мая 2010 г. 14:49, спустя 18 секунд

    Блин, что то не как не могу продуплить как сделать (image.jpg) слой что бы фото(top-foto.png) получилось под штрихами (top-dash.png) и над фоновым градиентом (top-gd.png)
    <div id="header" style="height:200px;width:100%;background:#000 url('top-gd.png') top left repeat-x;">
         <div id="top-right" style="height:120px;width:100%; background: transparent url('top-foto.png') top right no-repeat;"></div>
         <div id="top-left" style="height:200px;width:100%;background:url('top-dash.png') top left repeat-x;"></div>      
    </div>

    пробывал через z-index, но что то тоже не вышло…
    Подскажите, как его вставить
    Спустя 112 сек.
    вот градиент (top-gd.jpg) если что побольше картинка
  • phpdude

    Сообщения: 26646 Репутация: N Группа: в ухо

    Spritz 27 мая 2010 г. 14:49, спустя 23 часа 59 минут 42 секунды

    mario,


    <div
    <div
    <div


    у второго дива фиксируй высоту, а у первого делай background + padding-bottom и все
    Сапожник без сапог
  • mario

    Сообщения: 6067 Репутация: N Группа: Джедаи

    Spritz 27 мая 2010 г. 14:50, спустя 1 минуту 16 секунд

    + padding-bottom

    а это зачем? Что то я понять не могу…
  • phpdude

    Сообщения: 26646 Репутация: N Группа: в ухо

    Spritz 27 мая 2010 г. 14:53, спустя 3 минуты 5 секунд


    + padding-bottom

    а это зачем? Что то я понять не могу…
    это я хотел написать до того, как предложил фиксированную высоту второго блока :)

    чтобы второй можно было тянуть не думая о высоте верхнего контейнера
    Сапожник без сапог
  • mario

    Сообщения: 6067 Репутация: N Группа: Джедаи

    Spritz 27 мая 2010 г. 15:01, спустя 7 минут 41 секунду



    <div
    <div
    <div

    ты так имел ввиду?

    <div>штрих
    <div>градиент, с фиксированной высотой?
    <div>фото</div>
    </div>
    </div>


  • artoodetoo

    Сообщения: 5147 Репутация: N Группа: в ухо

    Spritz 27 мая 2010 г. 15:13, спустя 11 минут 45 секунд

    вот градиент

    о, елочка хуелочка )))
    ιιlllιlllι унц-унц
  • mario

    Сообщения: 6067 Репутация: N Группа: Джедаи

    Spritz 27 мая 2010 г. 15:13, спустя 20 секунд


    вот градиент

    елочка хуелочка )))
    :)
  • phpdude

    Сообщения: 26646 Репутация: N Группа: в ухо

    Spritz 27 мая 2010 г. 15:25, спустя 11 минут 56 секунд

    mario, да, так
    Сапожник без сапог
  • Givi

    Сообщения: 2284 Репутация: N Группа: Адекваты

    Spritz 27 мая 2010 г. 15:32, спустя 7 минут 17 секунд

    mario,
    <div>градиент, с фиксированной высотой
    <div>фото
    <div>штрих</div>
    </div>
    </div>

    Так все же будет правильней :)
    А насчет высоты, то Дуд правильно заметил - указывай её при возможности.
  • phpdude

    Сообщения: 26646 Репутация: N Группа: в ухо

    Spritz 27 мая 2010 г. 15:39, спустя 6 минут 46 секунд

    Givi, с одним бекраундом и пустым инерхтмл, див сохмется в 0 пикселей, ему высота 100 пудово пригодится)
    Сапожник без сапог
  • Абырвалг

    Сообщения: 6480 Репутация: N Группа: Джедаи

    Spritz 27 мая 2010 г. 15:52, спустя 12 минут 34 секунды

    две елочки-хуелочки в один день на пiха.ру

Пожалуйста, авторизуйтесь, чтобы написать комментарий!