Warning: Cannot use a scalar value as an array in /home/admin/public_html/forum/include/fm.class.php on line 757

Warning: Invalid argument supplied for foreach() in /home/admin/public_html/forum/include/fm.class.php on line 770

Warning: Invalid argument supplied for foreach() in /home/admin/public_html/forum/topic.php on line 737
Форумы портала PHP.SU :: Проблема с позицианированием

 PHP.SU

Программирование на PHP, MySQL и другие веб-технологии
PHP.SU Портал     На главную страницу форума Главная     Помощь Помощь     Поиск Поиск     Поиск Яндекс Поиск Яндекс     Вакансии  Пользователи Пользователи


 Страниц (1): [1]   

> Без описания
etoYA
Отправлено: 01 Ноября, 2011 - 21:51:13
Post Id



Участник


Покинул форум
Сообщений всего: 1859
Дата рег-ции: Июль 2011  
Откуда: Крым


Помог: 21 раз(а)




В общем у меня есть шапка, она резиновая, мне нужно, чтобы все блоки кроме #browsers были во врэппере, я реально уже все перепробовал(мне известное), но никак не получается то, что нужно..

Собственно вот коды шапки:

CSS
CODE (html):
скопировать код в буфер обмена
  1. #header {
  2.         position: relative;
  3.         width: 100%;
  4.         min-width: 1000px;
  5.         height: 600px;
  6.         background: url(images/header-bg.jpg) repeat-x;
  7. }
  8. #browsers {
  9.         position: absolute;
  10.         width: 479px;
  11.         height: 308px;
  12.         position: absolute;
  13.         top: 25px;
  14.         left: 25px;
  15.         background: url(images/browsers.png) no-repeat;
  16. }
  17. #slider {
  18.         width: 962px;
  19.         height: 202px;
  20.         position: absolute;
  21.         top: 359px;
  22.         left: 158px;
  23.         background: url(images/slider-bg.png) no-repeat;
  24. }
  25. #slider ul {
  26.         list-style: none;
  27. }
  28. #slider ul li {
  29.         margin: 0 5px;
  30.         padding: 10px 5px 20px 5px;
  31.         width: 160px;
  32.         height: 140px;
  33.         display: block;
  34.         background: #fff;
  35.         text-align: center;
  36.         float: left;
  37. }
  38. #slide-l {
  39.         width: 30px;
  40.         height: 92px;
  41.         position: absolute;
  42.         top: 434px;
  43.         left: 120px;
  44.         background: url(images/slide-l.png) no-repeat;
  45. }
  46. #slide-r {
  47.         width: 30px;
  48.         height: 92px;
  49.         position: absolute;
  50.         top: 434px;
  51.         left: 1130px;
  52.         background: url(images/slide-r.png) no-repeat;
  53. }


HTML

CODE (html):
скопировать код в буфер обмена
  1. <div id="header">
  2.         <div id="browsers"></div>
  3.         <div id="slide-l"></div>
  4.         <div id="slider">
  5.                 <div id="sliderSmall">
  6.                         <ul>
  7.                                 <li><a href="#"><img src="images/6.jpg"><p>Slider #1</p></a></li>
  8.                                 <li><a href="#"><img src="images/6.jpg"><p>Slider #1</p></a></li>
  9.                                 <li><a href="#"><img src="images/6.jpg"><p>Slider #1</p></a></li>
  10.                                 <li><a href="#"><img src="images/6.jpg"><p>Slider #1</p></a></li>
  11.                                 <li><a href="#"><img src="images/6.jpg"><p>Slider #1</p></a></li>
  12.                         </ul>
  13.                 </div>
  14.         </div>
  15.         <div id="slide-r"></div>
  16. </div>


Если кто-то хочет помощь, если нужно могу скинуть в личку архив с полным кодом и картинками..
 
 Top
join
Отправлено: 12 Ноября, 2011 - 06:39:07
Post Id



Гость


Покинул форум
Сообщений всего: 91
Дата рег-ции: Февр. 2011  


Помог: 1 раз(а)




CODE (html):
скопировать код в буфер обмена
  1.  
  2. <head>
  3. <style>
  4. #header {
  5.        
  6.         position: relative;
  7.         width: 100%;
  8.         min-width: 1000px;
  9.         height: 600px;
  10.         background: firebrick url(images/header-bg.jpg) repeat-x;
  11. }
  12. #browsers {
  13.         position: absolute;
  14.         width: 100px;
  15.         height: 108px;
  16.         top: 25px;
  17.         left: 25px;
  18.           z-index:1; /*если 0 - за slider, если 1 - поверх slider*/
  19.         background: rgb(10,101,01) url(images/browsers.png) no-repeat;
  20. }
  21. #slider {
  22.         width: 962px;
  23.         height: 202px;
  24.         position: relative;
  25.         top: 250px;
  26.            margin:0 auto;
  27.            border:3px inset yellow;
  28.         background: url(images/slider-bg.png) no-repeat;
  29. }
  30. #slider ul {
  31.         list-style: none;
  32. }
  33. #slider ul li {
  34.         margin: 0 2px;
  35.         padding: 10px 5px 20px 5px;
  36.         width: 160px;
  37.         height: 140px;
  38.         display: block;
  39.         background: #fff;
  40.         text-align: center;
  41.         float: left;
  42. }
  43. #slide-l {
  44.         width: 30px;
  45.         height: 92px;
  46.         position: relative;
  47.         /*top: 434px;
  48.         left: 120px;*/
  49.           float:left;
  50.           top:30pt;
  51.         background: royalblue url(images/slide-l.png) no-repeat;
  52. }
  53. #slide-r {
  54.         width: 30px;
  55.         height: 92px;
  56.         position: relative;
  57.         /*top: 434px;
  58.         left: 1130px;*/
  59.           top:20pt;
  60.         background: dodgerblue url(images/slide-r.png) no-repeat;
  61.           float:right;
  62. }
  63.  
  64. </style>
  65. <body>
  66. <div id="header">
  67.         <div id="browsers">brrrrowzzzer</div>
  68.         <div id="slider">
  69.                 <div id="sliderSmall">
  70.                        <div id="slide-l">SL</div>
  71.                         <ul>
  72.                                 <li><a href="#"><img src="images/6.jpg"><p>Slider #1</p></a></li>
  73.                                 <li><a href="#"><img src="images/6.jpg"><p>Slider #1</p></a></li>
  74.                                 <li><a href="#"><img src="images/6.jpg"><p>Slider #1</p></a></li>
  75.                                 <li><a href="#"><img src="images/6.jpg"><p>Slider #1</p></a></li>
  76.                                 <li><a href="#"><img src="images/6.jpg"><p>Slider #1</p></a></li>
  77.                                          
  78.                         </ul>
  79.                                 <div id="slide-r">SR</div>
  80.                 </div>
  81.         </div>
  82.        
  83. </div>
  84. </body>
  85. </html>
  86.  
  87.  


-----
- "Holy shit!" -девиз Холливуда
- "Hello world " -девиз PhP
 
 Top
Страниц (1): [1]
Сейчас эту тему просматривают: 0 (гостей: 0, зарегистрированных: 0)
« HTML, Дизайн & CSS »


Все гости форума могут просматривать этот раздел.
Только зарегистрированные пользователи могут создавать новые темы в этом разделе.
Только зарегистрированные пользователи могут отвечать на сообщения в этом разделе.
 



Powered by PHP  Powered By MySQL  Powered by Nginx  Valid CSS  RSS

 
Powered by ExBB FM 1.0 RC1. InvisionExBB