Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

> szablon serwisu na div'ach, problem z pozycjonowaniem
rozny
post
Post #1





Grupa: Zarejestrowani
Postów: 116
Pomógł: 0
Dołączył: 14.01.2004
Skąd: Zielona Góra

Ostrzeżenie: (0%)
-----

Witam!

Mam maly problem przy pozycjonowaniu blokow div.

Zrobilem juz 3 kolumny srodkowe + 1 gorna i wszystko pasi. Problem jest kiedy chce dorobic piata kolumne dla stopki. Nie moge jej wypozycjonowac i dociagnac do niej 3 srodkowe kolumny. Zawsze wskakuje mi pod 2 srodkowa kolumne i pozycjonuje sie wobec niej. Div footer znajduje sie na samym koncu pliku index. Nie znajduje sie w zadnym divie, wiec powinna sie pozycjonwac wzgledem okna przegladarki. Tutaj cos nie pasuje. Pozycjonujac go do TOP pozycjonuje sie wzgledem okna przegladarki. Pozycjonujac BOTTOM wzgledem nie wiem czego, ale na pewno nie wzgledem przegladarki. Nie wiem o co chodzi... Macie index:

[HTML] pobierz, plaintext 
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml" lang="pl" xml:lang="pl">
  3. <head>
  4. 	<link rel="stylesheet" href="styl.css" type="text/css" />
  5.       <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-2" />
  6.       <title>GASTRO-RODAN Centrum Wyposażenia Gastronomii i Hoteli - Witamy!!!</title>
  7.  
  8. </head>
  9.  
  10. <body>
  11.  
  12. <div id="logo">
  13. <img src="img/logo.gif" alt="logo" />
  14.  
  15.  
  16. 	<div id="sublogo">
  17. 		<img src="img/search.png" class="imgsearch" alt="szukaj" />
  18. 		<form action="?=search.php" method="post">
  19. 		<p><input type="text" name="search" class="topsearch" /></p>
  20. 		</form>
  21. 	</div>
  22.  
  23. 	<div id="sublogo_1">
  24. 		<strong>Szukaj w serwisie</strong>
  25. 	</div>
  26. 	<div class="logo_menu">
  27. <?php
  28. 	if (isset($_GET['menu'])) {
  29. 	$ext = ".inc";
  30. 	if ($_GET['menu'] == sklep) {
  31. 	include ("includes/logo_menu$ext");
  32. 	}
  33. 	}
  34. 	?>
  35. 	</div>
  36. </div>
  37.  
  38. <div id="szablon">
  39.  
  40. <?php include ("engine/engine.php"); ?>
  41.  
  42. </div>
  43.  
  44. <div id="left">
  45. 	<?php
  46. 	if (!isset($_GET['menu'])) {
  47. 	include ("includes/menu.inc");
  48. 	include ("includes/info.inc");
  49. 	}
  50. 	else {
  51. 	$ext = ".inc";
  52. 	$dir = "includes/";
  53. 	include ($dir.$_GET['menu'].$ext);
  54. 	}
  55. 	?>
  56. </div>
  57.  
  58. <div id="right">
  59. 	<?php
  60. 	include ("includes/promo.inc");
  61. 	?>
  62. </div>
  63.  
  64. <div id="footer">
  65. </div>
  66. </body>
  67. </html>
[HTML] pobierz, plaintext


a tutaj css'a:

[HTML] pobierz, plaintext 
  1. body {
  2. 	background-color: #aeaa89;
  3. 	margin: 20px 20px;
  4. 	padding: 0;
  5. 	font-size: 14px;
  6. 	background-image : url(img/bg.jpg);
  7. 	background-repeat : repeat-x;
  8. 	overflow: auto;
  9. }
  10.  
  11. div > h1 {
  12. 	margin-top: 0;
  13. }
  14.  
  15. #logo {
  16. 	position: relative;
  17. 	width: auto;
  18. 	min-width: 50px;
  19. 	height: 124px;
  20. 	margin: 0;
  21. 	border: 1px solid black;
  22. 	border-bottom: 0;
  23. 	background-color: #f6f5f1;
  24. 	padding: 10px;
  25. 	z-index: 3;
  26. }
  27.  
  28. #szablon {
  29.  
  30. 	position: relative;
  31. 	width: auto;
  32. 	min-width: 50px;
  33. 	height: 100%;
  34. 	min-height: 300px;
  35. 	margin: 0px 141px 0px 221px;
  36. 	border: 1px solid black;
  37. 	border-top: 1px solid black;
  38. 	background-color: #f6f5f1;
  39. 	padding: 10px;
  40. 	z-index: 4;
  41. }
  42.  
  43. #left {
  44. 	position: absolute;
  45. 	width: 200px;
  46. 	height: auto;
  47. 	min-height: 300px;
  48. 	top: 165px;
  49. 	left: 20px;
  50. 	font-size: 14px;
  51. 	border-top: 1px solid black;
  52. 	border-left: 1px solid black;
  53. 	border-bottom: 1px solid black;
  54. 	border-right: 1px solid black;
  55. 	background-color: #d2d0be;
  56. 	padding: 1% 10px;
  57. 	z-index: 5;
  58. }
  59.  
  60. #right {
  61. 	position: absolute;
  62. 	width: 120px;
  63. 	height: auto;
  64. 	min-height: 300px;
  65. 	top: 155px;
  66. 	right: 20px;
  67. 	font-size: 14px;
  68. 	border: 1px solid black;	
  69. 	background-color: #d2d0be;
  70. 	padding: 10px;
  71. 	z-index: 2;
  72. }
  73.  
  74. #footer {
  75.          position: absolute;
  76.          bottom: 5px;
  77. 	 width: auto;
  78. 	 height: 50px;
  79.          clear: both;
  80. 	 border: 1px solid black;
  81. 	 background-color: #f6f5f1;
  82. 	 z-index: 5;
  83. }
  84.  
  85. #sublogo {
  86. 	position: absolute;
  87. 	width: 120px;
  88. 	height: 5px;
  89. 	top: 0px;
  90. 	right: 0px;
  91. 	font-size: 14px;
  92. 	border: 0px solid black;
  93. 	border-bottom: 1px solid black;	
  94. 	padding: 10px;
  95. 	z-index: 2;
  96. }
  97.  
  98. #sublogo_1 {
  99. 	position: absolute;
  100. 	width: 120px;
  101. 	height: auto;
  102. 	top: 28px;
  103. 	right: 0px;
  104. 	font-size: 14px;
  105. 	text-align: right;
  106. 	border: 0px solid black;
  107. 	padding: 10px;
  108. 	z-index: 2;
  109. }
  110.  
  111.  
  112. ul.menu {
  113. 	list-style: none;
  114. 	padding: 0;
  115. 	margin: 0;
  116. 	border: 1px solid black;
  117. 	background-color: #f6f5f1;
  118. }
  119.  
  120. ul.menu li a:link {
  121. 	display: block;
  122. 	text-decoration: none;
  123. 	margin: 0;
  124. 	width: 88%;
  125. 	padding: 2px 6%;
  126. 	font: bold 1em/1.5 "arial, sans-serif";
  127. 	color: #000000;
  128. 	border-top: 1px solid black;
  129. }
  130.  
  131. ul.menu li a:visited {
  132. 	display: block;
  133. 	text-decoration: none;
  134. 	margin: 0;
  135. 	width: 88%;
  136. 	padding: 2px 6%;
  137. 	font: bold 1em/1.5 "arial, sans-serif";
  138. 	color: #000000;
  139. 	border-top: 1px solid black;
  140.  
  141. }
  142.  
  143. ul.menu li a:hover {
  144. 	display: block;
  145. 	text-decoration: none;
  146. 	margin: 0;
  147. 	width: 88%;
  148. 	padding: 2px 6%;
  149. 	font: bold 1em/1.5 "arial, sans-serif";
  150. 	color: #000000;
  151. 	border-top: 1px solid black;
  152. 	background-color: #e4e3d8;
  153.  
  154. }
  155.  
  156. h1.menu {
  157. 	font-size: 1.2em;
  158. 	padding: 0;
  159. 	text-align: center;
  160. }
  161.  
  162. ul.menu ul.submenu {
  163. 	list-style: none;
  164. 	margin: 0;
  165. 	padding: 0;
  166.  
  167. }
  168.  
  169. ul.menu ul.submenu li {
  170.  
  171. 	padding: 0;
  172. }
  173.  
  174. ul.menu ul.submenu li a:link {
  175. 	display: block;
  176. 	width: 99%;
  177. 	padding: 1px;
  178. 	font: bold 0.7em/1.5 verdana, sans-serif;
  179. 	color: #5c6f90;
  180.  
  181. }
  182.  
  183. ul.menu ul.submenu li a:visited {
  184. 	display: block;
  185. 	width: 99%;
  186. 	padding: 1px;
  187. 	font: bold 0.7em/1.5 verdana, sans-serif;
  188. 	color: #5c6f90;
  189.  
  190. }
  191.  
  192. ul.menu ul.submenu li a:hover {
  193. 	display: block;
  194. 	width: 99%;
  195. 	padding: 1px;
  196. 	font: bold 0.7em/1.5 verdana, sans-serif;
  197. 	color: #5c6f90;
  198. 	background-color: #e4e3d8;;
  199. }
  200.  
  201. div.info {
  202.  
  203. 	position: relative;
  204. 	width: 180px;
  205. 	height: auto;
  206. 	min-height: 100px;
  207. 	top: 10px;
  208. 	left: 0;
  209. 	font-size: 14px;
  210. 	border: 1px solid black;
  211. 	background-color: #f6f5f1;
  212. 	padding: 1% 10px;
  213. 	z-index: 5;
  214.  
  215. }
  216.  
  217. input.topsearch {
  218. 	position: absolute;
  219. 	background-color: #aeaa89;
  220. 	border: 1px solid black;
  221. 	top: 2px;
  222. 	right: 5px;
  223. 	width: 100px;
  224. }
  225.  
  226. .imgsearch {
  227. 	vertical-align: right;
  228. 	margin-left: 120px;
  229. }
  230.  
  231. div.logo_menu {
  232. 	position: absolute;
  233. 	top: 119px;
  234. 	left: 150px;
  235. 	border-top: 1px solid black;
  236. 	height: 5px;
  237. 	background-color: transparent;
  238. }
  239.  
  240. div.logo_menu a:link {
  241. 	padding: 1px;
  242. 	font: bold 0.9em/1.5 verdana, sans-serif;
  243. 	color: #000000;
  244. 	text-decoration: none;
  245. 	background-color: transparent;
  246. }
  247.  
  248. div.logo_menu a:visited {
  249. 	padding: 1px;
  250. 	font: bold 0.9em/1.5 verdana, sans-serif;
  251. 	color: #000000;
  252. 	text-decoration: none;
  253. 	background-color: transparent;
  254. }
  255.  
  256. div.logo_menu a:hover {
  257. 	padding: 1px;
  258. 	font: bold 0.9em/1.5 verdana, sans-serif;
  259. 	color: #aeaa89;
  260. 	text-decoration: none;
  261. 	background-color: transparent;
  262. }
  263.  
  264. img.info {
  265. 	display: block;
  266. 	margin-left: 38px;
  267. 	margin-bottom: 10px;
  268. 	border: 1px solid black;
  269. }
  270.  
  271. p.projekt {
  272. 	position: relative;
  273. 	left: 50px;
  274. }
  275.  
  276. ul.list_info {
  277. 	list-style: none;
  278. 	padding: 0;
  279. 	margin: 0;
  280. 	border: 0;
  281. 	background-color: #f6f5f1;
  282. }
  283.  
  284. #sublogo {
  285. 	position: absolute;
  286. 	width: 250px;
  287. 	height: 86%;
  288. 	top: 0;
  289. 	right: 0;
  290. 	font-size: 14px;
  291. 	border: 0px solid black;
  292. 	background-color: #f6f5f1;
  293. 	background-image: url("img/shader.gif");
  294. 	background-repeat: no-repeat;
  295. 	padding: 10px;
  296. 	z-index: 0;
  297. }
  298.  
  299. h7 {
  300. 	display: block;
  301. 	background-color: #f6f5f1;
  302. 	border: 1px solid black;
  303. 	border-bottom: 0;
  304. 	text-align: center;
  305. 	width: 120px;
  306. }
  307.  
  308. .inf {
  309. 	background-color: #f6f5f1;
  310. 	background-image : url(img/bg_inf.gif);
  311. 	background-repeat: no-repeat;
  312. 	background-position: bottom;
  313. 	width: 120px;
  314. 	height: auto;
  315. 	border: 0px solid black;
  316. 	margin-bottom: 10px;
  317. }
[HTML] pobierz, plaintext


Tutaj jest link do stronki:
strona www

PS. Skrypty php sa tymczasowe, poprostu musze zapelnic czyms bloki winksmiley.jpg

Dzieki za zainteresowanie i ewentualna pomoc smile.gif

pozdrawiam!

Nikt nie ma pomyslu jak to rozwiazac? bardzo prosze o pomoc, bo bede zmuszony zrezygnowac ze stopki wogole sad.gif

Ten post edytował rozny 15.11.2006, 23:58:28
Go to the top of the page
+Quote Post

Posty w temacie
- rozny   szablon serwisu na div'ach   16.11.2006, 10:32:11
- - dooq   #footer { position: absolute; /*bottom: 5px;*/ wi...   28.11.2006, 17:51:19
- - Saddam92   http://forum.php.pl/index.php?showtopic=56977 http...   28.11.2006, 20:39:15
- - Kreton   Moim zdaniem powinieneś, w przypadku takiego rozmi...   29.11.2006, 09:43:57

« Następny starszy · Po stronie przeglądarki · Następny nowszy »
 

Reply to this topicStart new topic
1 Użytkowników czyta ten temat (1 Gości i 0 Anonimowych użytkowników)
0 Zarejestrowanych:

 

Tryb wyświetlania: Przełącz na: Standardowy · Przełącz na: Linearny+ · Drzewo

Śledź ten temat · Wyślij temat na e-mail · Wydrukuj ten temat · Subskrybuj to forum

RSS Aktualny czas: 20.08.2025 - 16:39
Powered By IP.Board © 2025  IPS, Inc.
All changes by PHP.pl Administrators
Hosting zapewnia NQ.pl hosting, trac, svn