Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: Układ paneli
Forum PHP.pl > Forum > Po stronie przeglądarki
pietrov8
29.11.2009, 15:33:38
Witam.
Mam następujący problem. Tworzę stronę z dwoma układami paneli. Po prawej i lewej stronie.
Poniżej zamieszam link do wlaściwego wyglądu strony: http://img692.imageshack.us/i/sanumglowna.png/
A tutaj pojawiający się problem: http://img43.imageshack.us/i/32126395.png/

Proszę o pomoc
koderrr
29.11.2009, 15:46:58
mamy wrozyc z fusow ?

kod by sie przydal i info w jakiej przegladarce pojawia sie problem
pietrov8
29.11.2009, 17:40:07 
[HTML] pobierz, plaintext 
  1. <div class="caption">
  2. 	<div class="cap-head">
  3.     	<div class="head-left"><img src="images/layout/home_head.jpg" /> Jesteś w: <strong>Strona Główna</strong></div>
  4.         <div class="head-right"><form action="search.php" method="post">
  5.         <input id="search" type="text" value="Tutaj wpisz szukaną frazę" name="search" /><input type="image" id="search-img" src="images/layout/submit_search.gif" />
  6.         </form> </div></div>
  7.      <div class="cap-left">
  8.             <div class="cap-left-but">
  9.         	<a href="#"><img src="images/layout/large.png" /></a>
  10.             <a href="#"><img src="images/layout/normal.png" /></a>
  11.             <a href="#"><img src="images/layout/small.png" /></a>
  12.             <a href="#"><img src="images/layout/print.png" /></a></div>
  13.      	<h1><img src="images/layout/aktualnosci.png" alt="aktualnosci" /></h1>
  14.         <hr />
  15.         <div class="cap-news">
  16.         <div class="cap-news-left">
  17.         	<h2><a href="#">Zastosowanie leków izopatycznych u chorych na autyzm (nowa wersja)</a></h2>
  18.             <h4>dr n. med. Igor Łoniewski - 12.04.2008r.</h4>
  19.             <div class="cap-news-left-text">
  20.             <a href="#"><img src="images/news_images.jpg" class="news-img" alt="Obrazek newsa" /></a></div>
  21.             <h5><a href="#">Znaczenie prawidłowej czynności przewodu pokarmowego w terapii holistycznej jest powszechnie znane...</a></h5>   
  22. </div>
  23.         <div class="cap-news-right">
  24.         	<h2><a href="#">Leczenie dietetyczne w przypadku nadwrażliwości przewodu pokarmowego</a></h2>
  25.             <h4>dr n. med. Igor Łoniewski</h4>
  26.             <div class="cap-news-right-text">
  27.             <a href="#">Znaczenie prawidłowej czynności przewodu pokarmowego w terapii holistycznej jest powszechnie znane. Zmiany środowiskowe w przewodzie pokarmowym zachodzące pod wpływem czynników zewnętrznych...</a></div>
  28.             </div></div>
  29.         <hr />
  30.         <div class="cap-news-arch"><img src="images/layout/link_icon.gif" alt="ikonka" /> <a href="#">Archiwum aktualności</a></div></div>
  31.         <!-- Koniec 1 części środkowej części strony -->
  32.  
  33.         <div class="cap-right"><object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,0,0" id="mapa" align="middle" height="240" width="236">
  34. 	<param name="allowScriptAccess" value="sameDomain">
  35. 	<param name="allowFullScreen" value="false">
  36. 	<param name="movie" value="/images/mapa.swf">
  37. 	<param name="wmode" value="transparent">
  38. 	<param name="quality" value="high"><param name="bgcolor" value="#ffffff">	
  39. 	<embed src="images/banner/mapa.swf" quality="high" bgcolor="#ffffff" name="mapa" allowscriptaccess="sameDomain" allowfullscreen="false" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" wmode="transparent" align="middle" height="240" width="236" /><a style="left: 991.5px ! important; top: 678px ! important;" title="Kliknij tutaj, aby zablokować ten obiekt" class="srvwamuyoijqgwmrfwdj nlinsabnxifdllfgucfv" href="http://sanum.tsr2013.pl/images/mapa.swf"></a></object></div>
  40.     <div class="cap-right"></div>
  41. <div class="cap-shop">
  42.      	<h1><img src="images/layout/shop.png" alt="Skle Internetowy" /></h1>
  43.         <hr />
  44.         <div class="cap-shop-cap">
  45.         <div class="produkt"><h2>Produkt</h2>
  46.         <center><a href="#"><img src="images/image_product.jpg" alt="obrazek" /></a></center></div>
  47.         <div class="produkt"><h2>Produkt</h2>
  48.         <center><a href="#"><img src="images/image_product.jpg" alt="obrazek" /></a></center></div>
  49.         <div class="produkt-last"><h2>Produkt</h2>
  50.         <center><a href="#"><img src="images/image_product.jpg" alt="obrazek" /></a></center></div>
  51.         </div>
  52.         <hr />
  53. </div>
  54. <div class="newsletter">
  55. 		<h1><img src="images/layout/newsletter.png" alt="Newsletter"></h1>
  56.         <hr />
  57. 				<form action="#" method="post">
  58. 					<div><input name="email" id="input_newsletter" value="Wpisz adres email" type="text"></div>
  59. 					<div class="newsletter_submit"><input src="images/layout/add.gif" class="add" name="add" value="1" type="image"><input src="images/layout/remove.gif" class="remove" name="add" value="1" type="image"></div>
  60. 				</form>
  61. </div>
[HTML] pobierz, plaintext 


[HTML] pobierz, plaintext 
  1. div.caption{
  2. 	width:100%;
  3. 	min-height:400px;}
  4. div.cap-head{
  5. 	background:url(../images/layout/bg_head.jpg);
  6. 	background-repeat:repeat-x;
  7. 	height:41px;
  8. 	width:100%;
  9. 	color:#FFF;}
  10. 	div.head-left{
  11. 		float:left;
  12. 		padding-top:10px;
  13. 		font-family:Tahoma, Geneva, sans-serif;
  14. 		font-size:11px;
  15. 		padding-left:15px;}
  16. 	div.head-right{
  17. 		float:right;}
  18. 		input#search{
  19. 			background-repeat: no-repeat;
  20. 			border:0;
  21. 			background-image:url(../images/layout/input_search.png);
  22. 			display: block;
  23. 			width: 176px;
  24. 			height: 15px;
  25. 			float: left;
  26. 			padding: 4px;
  27. 			margin-top: 8px;
  28. 			margin-right: 7px;
  29. 			margin-left: 14px;
  30. 			color: #0665ff;
  31. 			font-size: 11px;}
  32. 		input#search-img{
  33. 				width: 20px;
  34. 				height: 19px;
  35. 				float: left;
  36. 				margin-top: 10px;
  37. 				margin-right:5px;}
  38. div.cap-left{
  39. 	background:#FFF;
  40. 	float: left;
  41. 	width: 635px;
  42. 	min-height:350px;
  43. }
  44. 	div.cap-left h1{
  45. 		margin-top:30px;
  46. 		margin-left:40px;}
  47. 	div.cap-left-but{
  48. 		float:right;
  49. 		padding-top:45px;
  50. 		padding-right:20px;
  51. 		padding-bottom:5px;}
  52. div.cap-news{
  53. 	width:580px;
  54. 	margin-left:38px;
  55. 	min-height:220px;}
  56. 	div.cap-news-arch{
  57. 		color:#679b15;
  58. 		margin-left:40px;
  59. 		font-size:11px;
  60. 		font-weight:bold;
  61. 		font-family:Tahoma, Geneva, sans-serif;}
  62. 		div.cap-news-arch a{
  63. 			color:#679b15;
  64. 			text-decoration:underline;}
  65. div.cap-news-left{
  66. 	background-image:url(../images/layout/news_bg.gif);
  67. 	background-position:right;
  68. 	background-repeat:no-repeat;
  69. 	width:280px;
  70. 	float:left;}
  71. 	div.cap-news-left a{
  72. 		text-decoration:none;
  73. 		color:#000;}
  74. 	div.cap-news-left h2{
  75. 		font-size:14px;}
  76. 		div.cap-news-left h2 a{
  77. 		color:blue;
  78. 		text-decoration:underline;
  79. 		font-size:14px;}
  80. 	div.cap-news-left h4{
  81. 		font-size:11px;
  82. 		color:#B5B5B5;
  83. 		font-weight:normal;
  84. 		font-family:Tahoma, Geneva, sans-serif;}
  85. 	div.cap-news-left h5{
  86. 		font-size:11px;
  87. 		font-weight:normal;
  88. 		font-family:Tahoma, Geneva, sans-serif;}
  89. 	img.news-img{
  90. 		border:#C2F1FF solid;
  91. 		float:none;
  92. 		margin-right:15px;}
  93. 	div.cap-news-left-text{
  94. 		color: #5e5e5e;
  95. 		float:left;
  96. 		font-size: 11px;
  97. 		font-weight: normal;
  98. 		line-height: 1.5em;
  99. 		font-family:Tahoma, Geneva, sans-serif;}
  100. div.cap-news-right{
  101. 	width:280px;
  102. 	float:right;}
  103. 	div.cap-news-right a{
  104. 		text-decoration:none;
  105. 		color:#000;}
  106. 	div.cap-news-right h2{
  107. 		font-size:14px;}
  108. 		div.cap-news-right h2 a{
  109. 		color:blue;
  110. 		text-decoration:underline;
  111. 		font-size:14px;}
  112. 	div.cap-news-right h4{
  113. 		font-size:11px;
  114. 		color:#B5B5B5;
  115. 		font-family:Tahoma, Geneva, sans-serif;
  116. 		font-weight:normal;}
  117. 	div.cap-news-right-text{
  118. 		color: #5e5e5e;
  119. 		font-size: 11px;
  120. 		font-weight: normal;
  121. 		line-height: 1.5em;
  122. 		font-family:Tahoma, Geneva, sans-serif;}
  123.  
  124. hr{
  125. 	border: 0;
  126. 	background-image:url(../images/layout/hr.png);
  127. 	background-repeat: no-repeat;
  128. 	width: 577px;
  129. 	height: 1px;
  130. 	clear: both;
  131. 	margin-top:5px;
  132. 	margin-left: 37px;}
  133.  
  134. div.cap-right{
  135. 	background:url(../images/layout/bg_37.jpg);
  136. 	background-repeat:repeat-x;
  137. 	background-color:#56A9FF;
  138. 	float:right;
  139. 	width:238px;
  140. 	min-height:245px;
  141. }
  142. div.cap-shop{
  143. 	background:#EEF9FF;
  144. 	float: left;
  145. 	width: 635px;
  146. 	min-height:250px;
  147. 	margin-top:1px;}
  148. 	div.cap-shop-cap{
  149. 		margin-left:40px;
  150. 		padding-bottom:20px;}
  151. 	div.cap-shop h1{
  152. 		margin-top:30px;
  153. 		margin-left:40px;}
  154. 	div.produkt{
  155. 			background-image:url(../images/layout/news_bg.gif);
  156. 			background-position:right;
  157. 			background-repeat:no-repeat;
  158. 			width:190px;
  159. 			float:left;}
  160. 	div.produkt-last{
  161. 			width:190px;
  162. 			float:left;}
  163. 	div.produkt-last h2{
  164. 		text-align:center;
  165. 		color:#458a35;
  166. 		font-family:Tahoma, Geneva, sans-serif;
  167. 		font-size:14px;}
  168. 	div.produkt h2{
  169. 		text-align:center;
  170. 		color:#458a35;
  171. 		font-family:Tahoma, Geneva, sans-serif;
  172. 		font-size:14px;}
  173. 	img.center{margin:auto;}
  174. div.newsletter{
  175. 	background:url(../images/layout/newsletter_bg.png);
  176. 	background-repeat:repeat-x;
  177. 	float:right;
  178. 	width:238px;
  179. 	min-height:110px;
  180. }
  181. div.newsletter h1{
  182. 	margin-left:10px;
  183. 	margin-top:10px;}
  184. .newsletter_submit
  185. {
  186. 	clear: both;
  187. }
  188. #input_newsletter
  189. {
  190. 	background-image: url(../images/layout/input_newsletter.gif);
  191. 	background-repeat: no-repeat;
  192. 	width: 185px;
  193. 	height: 15px;
  194. 	border: 0;
  195. 	margin-left: 16px;
  196. 	margin-top: 10px;
  197. 	float: left;
  198. 	display: block;
  199. 	padding: 5px 5px;
  200. 	color: #0665ff;
  201. 	font-size: 11px;
  202. }
  203. div.newsletter hr
  204. {
  205. 	background-image: url(../images/layout/hr_newsletter.gif);
  206. 	background-repeat: repeat-x;
  207. 	width: 192px !important;
  208. 	height: 1px !important;
  209. 	margin: 9px 0 0 17px;
  210. }
  211. .add
  212. {
  213. 	margin-left: 164px;
  214. 	margin-right: 8px;
  215. 	margin-top: 8px;
  216. 	float: left;
  217. }
  218. .remove
  219. {
  220. 	margin-top: 8px;
  221. 	float: left;
  222. }
[HTML] pobierz, plaintext
To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.
Invision Power Board © 2001-2025 Invision Power Services, Inc.