Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: Rozleziona strona w IE
Forum PHP.pl > Forum > Po stronie przeglądarki
damiano99
10.02.2010, 11:34:58
Posiadam stronkę www.karpacz24.eu, zmieniłem w niej grafikę i w Firefoxie działa wszystko bez zarzutu, natomiast w IE góra się rozłazi (Panel logowania jest na menu).

Wklejam kod indexu templatki, css i pliku site.tmp, proszę o pomoc jak zrobić, żeby w IE było ok.

index.php:
[PHP] pobierz, plaintext 
  1. <body>
  2. <!-- start header -->
  3. <div id="header">
  4. <? schowekMENU();  ?><br/>
  5. <? site_top(); ?>
  6. </div>
  7.  
  8. <!-- start page -->
  9. <div id="page">
  10. 	<!-- start content -->
  11. 	<div id="content">
  12. <div class="post">
  13. 		<? print_main(); ?>
  14. </div>
  15. 	</div>
  16. 	<!-- end content -->
  17. 	<!-- start sidebar -->
  18. <div id="sidebar">
  19. 	<? print_menu(); ?>
  20. </div>
  21. 	<!-- end sidebar -->
  22. </div>
  23. <div style="clear: both; height: 30px">&nbsp;</div>
  24. <!-- end page -->
  25. <div id="footer">
  26. 	<? site_footer();  ?>
  27. </div>
  28. </body>
[PHP] pobierz, plaintext



CSS:
[PHP] pobierz, plaintext 
  1. body {
  2. 	margin: 0;
  3. 	padding: 0;
  4. 	background: #372412 url(images/img01.gif) repeat-x;
  5. 	font-size: 13px;
  6. 	color: #FFFFFF;
  7. }
  8.  
  9. body, th, td, input, textarea, select, option {
  10. 	font-family: Arial, Helvetica, sans-serif;
  11. }
  12.  
  13. h1, h2, h3 {
  14. 	text-transform: lowercase;
  15. 	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
  16. 	font-weight: normal;
  17. 	color: #FFFFFF;
  18. }
  19.  
  20. h1 {
  21. 	letter-spacing: -2px;
  22. 	font-size: 3em;
  23. 	display:inline;
  24. }
  25.  
  26. h2 {
  27. 	letter-spacing: -1px;
  28. 	font-size: 2em;
  29. }
  30.  
  31. h3 {
  32. 	font-size: 1em;
  33. }
  34.  
  35. p, ul, ol {
  36. 	line-height: 200%;
  37. }
  38.  
  39. blockquote {
  40. 	padding-left: 1em;
  41. }
  42.  
  43. blockquote p, blockquote ul, blockquote ol {
  44. 	line-height: normal;
  45. 	font-style: italic;
  46. }
  47.  
  48. a {
  49. 	color: #FFFFFF;
  50. }
  51.  
  52. a:hover {
  53. 	text-decoration: non-decoration;
  54. }
  55.  
  56. img { border: none; }
  57.  
  58. /* Header */
  59.  
  60. #header {
  61. 	width: 830px;
  62. 	height: 200px;
  63. 	margin: 0 auto;
  64. 	background: url(images/img02.jpg) no-repeat;
  65. }
  66.  
  67. /* Logo */
  68.  
  69. #logo {
  70. 	height: 170px;
  71. 	background: url(images/img07.gif) no-repeat left 65%;
  72. }
  73.  
  74. #logo h1 {
  75. 	float: left;
  76. 	padding: 40px 40px 0 50px;
  77. 	letter-spacing: -2px;
  78. 	font-size: 48px;
  79. }
  80.  
  81. #logo h2 {
  82. 	float: right;
  83. 	padding: 68px 0 0 0;
  84. 	font-size: 13px;
  85.  
  86. }
  87.  
  88. #logo a {
  89. 	text-decoration: none;
  90. 	color: #372412;
  91. }
  92.  
  93. /* Gallery */
  94.  
  95. #gallery {
  96. 	clear: both;
  97. 	width: 830px;
  98. 	height: 300px;
  99. 	margin: 0 auto;
  100.  
  101. }
  102.  
  103. #top-photo h2 {
  104. 	height: 1.4em;
  105. 	font-size: 1em;
  106. }
  107.  
  108. #top-photo p {
  109. 	margin: 0;
  110. 	padding: 0 0 10px 0;
  111. }
  112.  
  113. /* Menu */
  114.  
  115. #menu {
  116. 	width: 830px;
  117. 	height: 70px;
  118. 	background: url(images/img03.jpg) no-repeat;
  119. }
  120.  
  121. #menu ul {
  122. 	margin: 0;
  123. 	padding: 0;
  124. 	list-style: none;
  125. }
  126.  
  127. #menu li {
  128. 	display: inline;
  129. }
  130.  
  131. #menu a {
  132. 	display: block;
  133. 	float: left;
  134. 	width: 166px;
  135. 	height: 73px;
  136. 	padding-top: 35px;
  137. 	text-transform: lowercase;
  138. 	text-decoration: none;
  139. 	text-align: center;
  140. 	letter-spacing: -1px;
  141. 	font-size: 24px;
  142. 	color: #FFFFFF;
  143. }
  144.  
  145. #menu a:hover {
  146. 	background: url(images/img09.jpg) no-repeat;
  147. 	color: #FFFFFF;
  148. }
  149.  
  150. #menu .active a {
  151. 	background: url(images/img09.jpg) no-repeat;
  152. 	color: #372412;
  153. }
  154.  
  155. /* Page */
  156.  
  157. #page {
  158. 	width: 830px;
  159. 	margin: 0 auto;
  160. 	padding: 20px 0;
  161. }
  162.  
  163. /* Content */
  164.  
  165. #content {
  166. 	float: left;
  167. 	width: 532px;
  168. }
  169.  
  170. .post {
  171. 	padding: 0 0 20px 0;
  172. }
  173.  
  174. .title {
  175. 	margin: 0;
  176. 	border-bottom: 2px solid #4A3903;
  177. }
  178.  
  179. .byline {
  180. 	margin: 0;
  181. }
  182.  
  183. .meta {
  184. 	border-top: 1px solid #4A3903;
  185. 	text-align: right;
  186. 	color: #646464;
  187. }
  188.  
  189. .meta a {
  190. 	padding-left: 15px;
  191. 	background: url(images/img06.gif) no-repeat left center;
  192. 	font-weight: bold;
  193. }
  194.  
  195. /* Sidebar */
  196.  
  197. #sidebar {
  198. 	float: right;
  199. 	width: 250px;
  200. }
  201.  
  202. #sidebar ul {
  203. 	margin: 0;
  204. 	padding: 0;
  205. 	list-style: none;
  206. }
  207.  
  208. #sidebar li {
  209. }
  210.  
  211. #sidebar li ul {
  212. 	padding: 15px 0;
  213. }
  214.  
  215. #sidebar li li {
  216. 	padding-left: 30px;
  217. 	border-bottom: 1px dotted #4A3903;
  218. 	background: url(images/img06.gif) no-repeat 15px 50%;
  219. }
  220.  
  221. #sidebar h2 {
  222. 	margin: 0;
  223. 	padding: 20px 0 2px 30px;
  224. 	background: url(images/img05.gif) no-repeat left bottom;
  225. 	border-bottom: 2px solid #4A3903;
  226. }
  227.  
  228. #sidebar a {
  229. 	text-decoration: none;
  230. }
  231.  
  232. #sidebar a:hover {
  233. 	text-decoration: underline;
  234. }
  235.  
  236. /* Footer */
  237.  
  238. #footer {
  239. 	clear: both;
  240. 	padding: 20px 0;
  241. 	background: #FFEA6F;
  242. 	border-top: 3px solid #E8AD35;
  243. 	text-align: center;
  244. 	font-size: smaller;
  245. 	color: #E8AD35;
  246. }
  247.  
  248. #footer a {
  249. 	color: #C28C21;
  250. }
  251.  
  252.  
  253. img.fotka {
  254. border: 1px solid #dddddd !important;
  255. padding: 2px;
  256. background-color: #ffffff;
  257. margin-right:5px;
  258. }
  259.  
  260. .uni_01 {
  261.   font-family: Verdana;
  262.   font-size: 12px;
  263.   padding-top: 0px;
  264.   padding-right: 3px;
  265.   padding-bottom: 0px;
  266.   padding-left: 3px;
  267.   color: #FFFFFF;
  268. }
  269.  
  270. .title_g {
  271. font-family: Verdana;
  272. margin:0px;
  273. padding:7px 8px;
  274. overflow:hidden;
  275. font-weight:bold;
  276. font-size:13px;
  277. color:#FFFFFF;
  278. }
  279.  
  280. .link_g {
  281. font-family: Verdana;
  282. margin:0px;
  283. padding:7px 8px;
  284. overflow:hidden;
  285. font-weight:bold;
  286. font-size:12px;
  287. color:#FFFFFF;
  288. background: #372413;
  289. }
[PHP] pobierz, plaintext


site.tmp:

[PHP] pobierz, plaintext 
  1. <?
  2.  
  3. function site_top(){
  4.  
  5. echo'
  6.  
  7. <div id="logo">
  8. <h1><a href="http://www.karpacz24.eu" title="karpacz">Karpacz24.eu</a></h1>
  9.  
  10. ';
  11.  
  12. user_panel();
  13.  
  14. echo'
  15.  
  16. </div>
  17.  
  18. <div id="menu">
  19. <ul>
  20. <li class="active"><a href="index.html" accesskey="1" title="strona główna">Strona Główna</a></li>
  21. <li><a href="oferta.html" accesskey="3" title="baza noclegowa">Katalog</a></li>
  22. <li><a href="wyszukiwarka.html" accesskey="4" title="wyszukiwarka noclegów">Wyszukiwarka</a></li>
  23. <li><a href="profil.html" accesskey="5" title="Profil obiektu">Dodaj ofertę</a></li>
  24. <li><a href="ogloszenie.html" accesskey="6" title="ogloszenia noclegowe">Dodaj ogłoszenie</a></li>
  25. </ul>
  26. </div>
  27. </div>
  28.  
  29. <!-- end header -->
  30. <div id="gallery">
  31. <div id="top-photo">
  32. <p><a href="http://www.karpacz24.eu" title="noclegi w Karpaczu"><img src="tmp/images/img08.jpg" alt="karpacz" width="830" height="300" /></a></p>
  33. </div>
  34.  
  35. ';
  36.  
  37. }
  38.  
  39.  
  40.  
  41.  
  42.  
  43. function site_title_open(){
  44.  
  45. echo'<table width="100%">
  46. <tr>
  47. <td class="title">
  48. ';
  49. }
  50.  
  51. function site_title_close(){
  52.  
  53. echo'
  54.  
  55. </td>
  56. </tr>
  57. </table>
  58. ';
  59. }
  60.  
  61. function site_body_open(){
  62.  
  63. echo'
  64.  
  65. ';
  66. }
  67.  
  68. function site_body_close(){
  69.  
  70. echo'
  71.  
  72. ';
  73. }
  74.  
  75.  
  76. function menu_title_open(){
  77.  
  78. echo'
  79.  
  80. ';
  81. }
  82.  
  83. function menu_title_close(){
  84.  
  85. echo'
  86.  
  87. ';
  88. }
  89.  
  90. function menu_body_open(){
  91.  
  92. echo'
  93. ';
  94. }
  95.  
  96. function menu_body_close(){
  97.  
  98. echo'
  99.  
  100. ';
  101. }
  102.  
  103.  
  104. function site_footer(){
  105.  
  106.  
  107. echo'
  108.  
  109. <p><A HREF="index.html" TITLE="karpacz">Strona Główna</A> | <A HREF="kontakt.html" TITLE="kontakt">Kontakt</A> | <A HREF="regulamin.html" TITLE="regulamin">Regulamin</A> | <A HREF="onas.html" TITLE="o karpaczu">O Karpaczu</A></td></tr>
  110. <p>&copy;2010 <a href="http://www.karpacz24.eu" title="karpacz"><strong>karpacz24.eu</strong></a> by <a href="http://www.nodnet.pl" title="tanie strony www, wizytówki"><strong>NodNET</strong></a></p>
  111.  
  112. ';
  113.  
  114. }
  115.  
  116.  
  117. ?>
  118.  
[PHP] pobierz, plaintext
nospor
10.02.2010, 12:03:34
No ale dlaczego dajesz to w dziale PHP....? Przenosze
roobik
15.02.2010, 12:50:36
Ja zrobiłbym dwa pliki css: jeden pod IE, a drugi dla "reszty" winksmiley.jpg
Nie chcę być w błędzie (nie sprawdzałem tego na podst Twojego kodu), ale może spróbujesz:
[HTML] pobierz, plaintext 
  1. <!--[if IE]>
  2. <link rel="stylesheet" type="text/css" href="sciezka_do_pliku/ie.css" media="all">
  3. <![endif]-->
[HTML] pobierz, plaintext

i w pliku ie.css kombinować z margin-top ?
korek_a
16.02.2010, 17:07:21
80% problemy z wyświetleniem wyjaśnia przejście strony przez walidator w tym wypadku podejrzewam podobnie "366 Errors" a tym przypadku chodzi o nie zamkniecie znaczników w xhtml zamykamy wszystkie znaczniki ff ma auto korektę i zamyka znaczniki za to ie już nie spróbuj najpierw pozamykać znaczniki a później zobaczymy czy to to
uczeń php
28.02.2010, 15:44:38
Zrób coś takiego
<!--[if lte IE 7]>
Kod css dla ie
<![endif]-->
albo zainstaluj ie-8
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.