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
Форумы портала PHP.SU :: Версия для печати :: Размер дива
Форумы портала PHP.SU » Клиентская разработка » HTML, Дизайн & CSS » Размер дива

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

1. naciya - 26 Ноября, 2015 - 19:15:11 - перейти к сообщению
Страница делиться на четыре дива: шапка, левая колонка (меню), правая колонка (область основного контента) и низ. Так вот низ плавает с основным контентом, то есть если информации мало то область основного контента маленькая и низ перекрывает часть меню. так вот как сделать что бы область основного контента была больше или равна блоку меню? фот скрин как это выглядит
2. DeepVarvar - 26 Ноября, 2015 - 20:02:01 - перейти к сообщению
http://jsfiddle[dot]net/j14m8xc1/
3. naciya - 26 Ноября, 2015 - 20:20:28 - перейти к сообщению
DeepVarvar пишет:
http://jsfiddle.net/j14m8xc1/

да я вставил на этот сайт свой код и все нормально показывает, а в деле нифига, если контент загрузить еще, то все ок, а так.... вот код, можешь сам посмотреть
CODE (htmlphp):
скопировать код в буфер обмена
  1.         <body>
  2.  
  3.                 <div id="header">
  4.                         <!-- Верхняя часть страницы -->
  5.                 <? include'inc/header.inc.php'; ?>
  6.                         <!-- Верхняя часть страницы -->
  7.                 </div>
  8.  
  9.                 <div id="content">
  10.                         <!-- Заголовок -->
  11.                         <h1 align="center"><?= $header?></h1>
  12.                         <!-- Заголовок -->
  13.                         <!-- Область основного контента -->
  14.                         <?php
  15.                                 include 'inc/routing.inc.php';
  16.                         ?>     
  17.                         <!-- Область основного контента -->
  18.                 </div>
  19.                 <div id="nav">
  20.                         <!-- Навигация -->
  21.                         <h2 align="center">Фильмы</h2>
  22.                         <ul>
  23.                                 <li><a href='index.php'>Главная</a></li>
  24.                                 <li><a href='index.php?id=ganre&ganre=Биография'>Биография</a></li>
  25.                                 <li><a href='index.php?id=ganre&ganre=Боевик'>Боевики</a></li>
  26.                                 <li><a href='index.php?id=ganre&ganre=Вестерн'>Вестерн</a></li>
  27.                                 <li><a href='index.php?id=ganre&ganre=Военный'>Военный</a></li>
  28.                                 <li><a href='index.php?id=ganre&ganre=Детектив'>Детектив</a></li>
  29.                                 <li><a href='index.php?id=ganre&ganre=Документальный'>Документальный</a></li>
  30.                                 <li><a href='index.php?id=ganre&ganre=Драма'>Драма</a></li>
  31.                                 <li><a href='index.php?id=ganre&ganre=История'>История</a></li>
  32.                                 <li><a href='index.php?id=ganre&ganre=Катастрофа'>Катастрофа</a></li>
  33.                                 <li><a href='index.php?id=ganre&ganre=Комедия'>Комедии</a></li>
  34.                                 <li><a href='index.php?id=ganre&ganre=Криминал'>Криминал</a></li>
  35.                                 <li><a href='index.php?id=ganre&ganre=Мелодрама'>Мелодрама</a></li>
  36.                                 <li><a href='index.php?id=ganre&ganre=Мультфильмы'>Мультфильмы</a></li>
  37.                                 <li><a href='index.php?id=ganre&ganre=Мистика'>Мистика</a></li>
  38.                                 <li><a href='index.php?id=ganre&ganre=Мюзикл'>Мюзикл</a></li>
  39.                                 <li><a href='index.php?id=ganre&ganre=Приключения'>Приключения</a></li>
  40.                                 <li><a href='index.php?id=ganre&ganre=Семейный'>Семейный</a></li>
  41.                                 <li><a href='index.php?id=ganre&ganre=Спорт'>Спорт</a></li>
  42.                                 <li><a href='index.php?id=ganre&ganre=Триллеры'>Триллеры</a></li>
  43.                                 <li><a href='index.php?id=ganre&ganre=Ужасы'>Ужасы</a></li>
  44.                                 <li><a href='index.php?id=ganre&ganre=Фантастика'>Фантастика</a></li>
  45.                                 <li><a href='index.php?id=ganre&ganre=Фэнтези'>Фэнтези</a></li>
  46.                         </ul>
  47.                         <!-- Навигация -->
  48.                 </div>
  49.                 <div id="footer">
  50.                         <!-- Нижняя часть страницы -->
  51.                 <?php include'inc/footer.inc.php';?>
  52.                         <!-- Нижняя часть страницы -->
  53.                 </div>
  54.         </body>

(Добавление)
и вот css
CODE (htmlphp):
скопировать код в буфер обмена
  1. body {
  2.         margin: 0;
  3.         padding: 0;
  4.         background-color: #FFFFFF;
  5.         color: #000000;
  6.         font-family: Arial, Helvetica, sans-serif;
  7.         border-top: 2px solid #2A4F6F;
  8.         background-color: #F3F4FF;
  9. }
  10. #header {
  11.         border-top: 1px solid #778899;
  12.         border-bottom: 1px dotted #B2BCC6;
  13.         height:3em;
  14.         background-color: #6774EB;
  15. }
  16. #header .slogan {
  17.         font: 120% Georgia, "Times New Roman", Times, serif;
  18.         color: #778899;
  19.         background-color: transparent;
  20.         float: right;
  21.         width: 300px;
  22.         text-align:right;
  23.         margin-right: 2em;
  24.         margin-top: 0.5em;
  25. }
  26. #header .logo {
  27.         float: left;
  28.         width: 187px;
  29.         margin-left: 1.5em;
  30.         margin-top: 0.5em;
  31. }
  32. #nav {
  33.         position: absolute;
  34.         top: 3.9em;
  35.         left: 1em;
  36.         width: 14em;
  37.        
  38. }
  39. #nav ul {
  40.         list-style: none;
  41.         margin-left: 1em;
  42.         padding-left: 0;
  43. }
  44. #nav li {
  45.         font-size: 90%;
  46.         border-bottom: 1px dotted #B2BCC6;
  47.         margin-bottom: 0.3em;
  48. }
  49. #nav a:link, #nav a:visited {
  50.         text-decoration: none;
  51.         color: #FCFCFD;
  52.         background-color: transparent; 
  53. }
  54. #nav a:hover {
  55.         color: #F99B3E;
  56. }
  57. #nav h2 {
  58.         font: 110% Georgia, "Times New Roman", Times, serif;
  59.         color: #2A4F6F;
  60.         background-color: transparent;
  61.         border-bottom: 1px dotted #cccccc;
  62. }
  63. #content {
  64.         margin-left: 16em;
  65.         margin-right: 2em;
  66.         text-align: justify;
  67. }
  68. h1 {
  69.         font: 150% Georgia, "Times New Roman", Times, serif;
  70. }
  71. blockquote {
  72.         font: 70% Georgia, "Times New Roman", Times, serif;
  73.         text-align: right;
  74. }
  75. h3 {
  76.         font: 120% Georgia, "Times New Roman", Times, serif;
  77. }
  78. ol li {
  79.         font-size: 90%;
  80.        
  81. }
  82. #content p, form {
  83.         font-size: 90%;
  84.         line-height: 1.6em;
  85.         padding-left: 1.2em;
  86. }
  87. #footer{
  88.         clear: both;
  89.         text-align: center;
  90.         border-top: 1px dotted #B2BCC6;
  91.         margin-top: 10px;
  92.         font: 90% Georgia, "Times New Roman", Times, serif;
  93.         color: #2A4F6F;
  94.         background-color: transparent;
  95. }
4. Faraon-san - 27 Ноября, 2015 - 15:10:08 - перейти к сообщению
у тебя блок с навигацией в абсолютном позиционировании.
у тебя надо не много верстку поменять.

 

Powered by ExBB FM 1.0 RC1