Форум: Форум PHPФорум ApacheФорум Регулярные ВыраженияФорум MySQLHTML+CSS+JavaScriptФорум FlashРазное
Новые темы: 0000000
Объектно-ориентированное программирование на PHP. Авторы: Кузнецов М.В., Симдянов И.В. PHP Puzzles. Авторы: Кузнецов М.В., Симдянов И.В. Социальная инженерия и социальные хакеры. Авторы: Кузнецов М.В., Симдянов И.В. MySQL 5. В подлиннике. Авторы: Кузнецов М.В., Симдянов И.В. PHP на примерах (2 издание). Авторы: Кузнецов М.В., Симдянов И.В.
ВСЕ НАШИ КНИГИ
Консультационный центр SoftTime

HTML+CSS+JavaScript

Выбрать другой форум

 

Здравствуйте, Посетитель!

вид форума:
Линейный форум Структурный форум

тема: Верстка блока
 
 автор: Director_Of_Zoo   (20.04.2008 в 21:23)   письмо автору
 
 

Вот собственно вопрос, над которым я ломаю голову не один день. Верстка планируется в png. Как вино что на блоке градиентная заливка. Высота переменная. Я разбил на 3 части - верх, середина и нижняя часть. Верхняя часть получилась 238px. Никак не получается соеденить эти 3 части (верх, залитую середину, низ) так чтобы получилась целая картина, по которой можно было бы писать текст. Попробовал отрицательное позиционирование, но ничего не вышло, нижняя часть как была на месте так и осталась.
вод код для примера:

    <div id='content'>
                    <div id='contblock'>
                        <div id='info'>
                            ddd
                        </div> 
                        <div id='bg_body_bottom'>
                            ddddwwwsw                            
                        </div>                                               
                     </div>
                </div>


css:

#content{
    width:713px;
    min-height:257px;
    margin:10px 0 0 21px;
    background:url(../images/top_bg_content.png) left top no-repeat;
    /*border:#FF00ff thin solid;*/    
}
#contblock{ /* фиолетовое*/
    position:relative;
    top:238px;
    min-height:0;
    /*padding-bottom:-238px;*/    
    /*border:#FF00ff thin solid;*/
    /*min-height:238px;*/
    background: url(../images/bg_content.png) top left repeat-y;
}
#info{
    position:relative;
    top:-218px;
    padding: 0 75px 0 25px;
    /*border:#FF0000 thin solid;*/
}
#bg_body_bottom{
    position:relative;
    background:url(../images/bg_bottom_cont.png) bottom left no-repeat;
    height:28px;
    /*border:#FFff00 thin solid;*/
    /*margin:0 0 0 21px;*/
}


Может можно было бы спозиционировать абсолютно но все находится на странице и position:absolute использовать не получается.

   
 
 автор: AlexSol   (20.04.2008 в 23:20)   письмо автору
 
   для: Director_Of_Zoo   (20.04.2008 в 21:23)
 

переменная высота чего, блока или градиента?
один рисок содержащий весь градиент

   
 
 автор: Director_Of_Zoo   (21.04.2008 в 08:18)   письмо автору
 
   для: AlexSol   (20.04.2008 в 23:20)
 

переменная высота блока с содержимым. Градиент имеет чёткую высоту - 238px. C утра подумал о выносе этого градиента в отдельный блок. Плюс ещё кой какие идеи. Может кто что предложит.

   
 
 автор: AlexSol   (21.04.2008 в 11:38)   письмо автору
 
   для: Director_Of_Zoo   (21.04.2008 в 08:18)
 

весь гдадиент одной картинкой и фоном к блоку с текстом. проблема в чем?

   
 
 автор: Director_Of_Zoo   (21.04.2008 в 15:25)   письмо автору
 
   для: AlexSol   (21.04.2008 в 11:38)
 

проблема в том что, блок с текстом имеет переменную высоту и фон под ним соответственно должен растягиваться

   
 
 автор: AlexSol   (21.04.2008 в 17:14)   письмо автору
 
   для: Director_Of_Zoo   (21.04.2008 в 15:25)
 

растягивающийся градиент? упушение дизайнера и геморой для вас.

   
 
 автор: Director_Of_Zoo   (22.04.2008 в 09:06)   письмо автору
 
   для: AlexSol   (21.04.2008 в 17:14)
 

это не упущение дизайнера а прихоть заказчика. Гемморой для меня это точно, тк. весь сайт пришлось строить на прозрачных png которые IE6 не хочет понимать. Ну вопрос пока остался открытым.

   
Rambler's Top100
вверх

Rambler's Top100 Яндекс.Метрика Яндекс цитирования