Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

> [CSS][HTML][PHP]Różne przeglądarki - inny wygląd strony :?:
deadmen4
post
Post #1





Grupa: Zarejestrowani
Postów: 60
Pomógł: 0
Dołączył: 17.02.2010
Skąd: Gliwice

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


Witam,

Mam stronę (na bezpłatnym hostingu), na której uczę się powoli (od podstaw) języków. Narazie już coś w miare jest, ale nie dawno zauważyłem potworny problem.

Strona w INTERNET EXPLORER (każda wersja), wygląda tak jak ma wyglądać (tak jak chce). A w KAŻDEJ innej przeglądarce (firefox, opera, safari, itd.) wygląda do bani. (nie trzyma rozmiarów, nie wyświetla elementów, i dużo więcej...)
Zresztą zrobiłem screeny:

w IE : >>> ZDJĘCIE <<<

w innej: >>> ZDJĘCIE <<<

INDEX.PHP

  1.  
  2. <?php
  3. if((!isset($_COOKIE['licznikowe-ciacho'])) && (!strstr($_SERVER['HTTP_REFERER'], "csmap.yoyo.pl"))) {
  4. $plik = fopen("licznik.txt", "r");
  5. $tekst = fread($plik, filesize("licznik.txt"));
  6. $dane = explode(";", $tekst);
  7. fclose($plik);
  8. $plik = fopen("licznik.txt", "w");
  9. flock($plik, 2);
  10. $dane[0]++;
  11. fwrite($plik, "$dane[0];", 15);
  12. flock($plik, 3);
  13. fclose($plik);
  14. setcookie("licznikowe-ciacho", "zliczono", time()+30*60);
  15. }
  16. else {
  17. $plik = fopen("licznik.txt", "r");
  18. $tekst = fread($plik, filesize("licznik.txt"));
  19. $dane = explode(";", $tekst);
  20. }
  21.  
  22. ?>
  23.  
  24.  
  25. <html>
  26. <head>
  27. <link rel="Stylesheet" type="text/css" href="index.css" />
  28.  
  29. <title>STRONA</title>
  30. <meta name="Description" content="Skrypty, pomoce, wiadomosci, portal, wszsytko" />
  31. <meta name="Author" content="Marox" />
  32. <meta http-equiv="Expires" content="0" />
  33. <meta http-equiv="Cache-Control" content="no-store, no-cache, must-revalidate" />
  34. <meta http-equiv="Cache-Control" content="post-check=0, pre-check=0" />
  35. <meta http-equiv="Pragma" content="no-cache" />
  36. <link rel="Shortcut icon" href="http://www.multihack.pl/favicon.ico" />
  37.  
  38.  
  39.  
  40.  
  41.  
  42.  
  43.  
  44.  
  45.  
  46. </head>
  47.  
  48.  
  49.  
  50. <body background="tlo_strona.jpg">
  51.  
  52.  
  53. <div id="strona">
  54. <table width="100%" cellspacing="0" cellpadding="0">
  55. <tr>
  56. <td style="{ position: relative; bottom: 1mm; }" colspan="2" align="center" valign="medium"><img src="logo.gif" alt="LOGO" /></td>
  57. </tr>
  58. </table>
  59.  
  60.  
  61.  
  62. <?php
  63.  
  64.  
  65.  
  66. switch ($_GET['cos']) {
  67. case 'losowanie': include ('losowanie.php');
  68. break;
  69.  
  70. case 'ankieta': include ('formularz.php');
  71. break;
  72.  
  73. case 'chat': include ('chat/index.php');
  74. break;
  75.  
  76. case '': include ('a.php');
  77. break;
  78.  
  79. case 'bug': include ('bug.php');
  80. break;
  81.  
  82. case 'sonda': include ('ocena.php');
  83. break;
  84.  
  85. case 'gra': include ('game.php');
  86. break;
  87.  
  88.  
  89. default :
  90.  
  91.  
  92. }
  93.  
  94. ?>
  95.  
  96. <div id="menu">
  97.  
  98. <dl>
  99. <dt>MENU</dt>
  100. <dd><a href='index.php'>Strona Główna</a></dd>
  101. <dd><a href='index.php?cos=ankieta'>Ankieta</a></dd>
  102. <dd><a href='index.php?cos=sonda&id=1'>Oceń strone</a></dd>
  103. <dd><a href='index.php?cos=gra'>Poziom strony</a></dd>
  104. <dt>NARZĘDZIA</dt>
  105. <dd><a href='index.php?cos=losowanie'>Losowanie Liczb</a></dd>
  106. <dt>CZAT</dt>
  107. <dd><a href='/chat/index.php'>Wejdź na Czat</a></dd>
  108. <dt>SUPPORT</dt>
  109. <dd><a href='index.php?cos=bug'>Zgłaszanie Błędow</a></dd>
  110. </dl>
  111. <div id="sonda56676">Firewall: <a href="http://www.hanzo.eu/3,86,pl,netasq_IPS_U1100.html">netasq IPS U1100</a></div>
  112. <script type="text/javascript" src="http://sonda.hanzo.eu/sonda.js,56676,kVPb,9AIh"></script>
  113. </div>
  114.  
  115. <table width="100%" cellspacing="0" cellpadding="10">
  116. <tr>
  117. <td style="{ position: relative; top: 1mm; }" bgcolor="#888888" colspan="2" align="center" valign="middle"> &copy; 2010; <i>Created by </i> <b> Marox</b><i style=" { color: white; position: relative; left: 8cm; }">Stronę odwiedziło już<b> <?php echo($dane[0]); ?></b> osób</i></td>
  118. </tr>
  119. <tr>
  120.  
  121.  
  122.  
  123. </div>
  124. </body>
  125. </html>
  126.  

Tak tylko: to pierwsze to do licznika wejść.

Podstron includowanych nie bede załączał, tylko powiem, że każda trafia do diva "reszta".

CSS:

  1.  
  2. html, body {
  3.  
  4. width: 1000px;
  5. margin: 0auto;
  6. padding: 0 auto;
  7.  
  8. }
  9.  
  10.  
  11. #strona {
  12. width: 1000px;
  13.  
  14.  
  15.  
  16.  
  17.  
  18.  
  19.  
  20.  
  21. border-left-style: dotted;
  22.  
  23. border-right-style: dotted;
  24. border-width: 4px;
  25. border-color: yellow;
  26.  
  27. }
  28.  
  29. #menu {
  30. width:250px;
  31. float:left;
  32.  
  33.  
  34.  
  35. }
  36.  
  37. #reszta {
  38.  
  39.  
  40. width:730px;
  41. float:right;
  42. background-color: #FFCCCC;
  43. font-family: Tahoma, cursive;
  44. border-style: solid;
  45. border-width: 2px;
  46. border-color: red;
  47.  
  48. }
  49.  
  50.  
  51.  
  52.  
  53.  
  54.  
  55. hr {
  56.  
  57. color: green;
  58.  
  59. }
  60.  
  61.  
  62.  
  63.  
  64. textarea {
  65.  
  66.  
  67. scrollbar-arrow-color: red;
  68. scrollbar-3dlight-color: black;
  69. scrollbar-shadow-color: black;
  70. scrollbar-highlight-color: lime;
  71. border-bottom-style: solid;
  72. border-left-style: solid;
  73. border-top-style: solid;
  74. border-right-style: solid;
  75. border-bottom-width: thin;
  76. border-left-width: thin;
  77. border-top-width: thin;
  78. border-right-width: thin;
  79. border-bottom-color: #3300FF;
  80. border-left-color: #3300FF;
  81. border-top-color: #3300FF;
  82. border-right-color: #3300FF;
  83.  
  84.  
  85.  
  86. }
  87.  
  88.  
  89.  
  90. dl, dt, dd {
  91. display: block;
  92. margin: 0;
  93. padding: 0;
  94. position: fixed; left: 0cm;
  95. width: 250px;
  96. float: left;
  97. font-family: Arial Black, Verdana
  98.  
  99.  
  100.  
  101.  
  102. }
  103.  
  104. dt {
  105. width: 250px;
  106. padding: 5px 10px;
  107. font-weight: bold;
  108. font-size: larger;
  109. text-align: center;
  110. background: #797 url("tlo3.gif") repeat-x top;
  111. color: lime;
  112. border-width: 2px;
  113. border-style: solid;
  114. border-color: blue blue blue blue;
  115. font-family: Verdana;
  116. }
  117.  
  118. dd {
  119. width: 250px;
  120. padding-left: 10px;
  121. background: #797 url("punkt.gif") no-repeat left top;
  122. border-width: 1px;
  123. border-style: solid;
  124. border-color: black black black black;
  125.  
  126. }
  127.  
  128. dl a:link, dl a:visited {
  129. display: block;
  130. width: 220px;
  131. text-decoration: none;
  132. padding: 5px 10px;
  133. font-weight: bold;
  134. background: #bfb url("tlo2.gif") repeat-x top;
  135. color: red;
  136. border-left: 1px solid #797;
  137. }
  138.  
  139. dl a:hover {
  140. background-color: #797;
  141. background-image: url("tlo.gif");
  142. color: red;
  143.  
  144. }
  145.  
  146.  


Css jest do każdej podstrony.

(IMG:style_emoticons/default/sciana.gif) (IMG:style_emoticons/default/sciana.gif)

Proszę o pomoc bo, odkryłem to niedawno i nie wiem co jest nie tak.




PS.

To tylko strona testowa do nauki, jej treść jest byle jaka. Dopiero ucze się.
Screeny nie wyraźne bo na szybko robione.
Strona jest tu: http://csmap.yoyo.pl
Jak ktoś chce looknąć.




Go to the top of the page
+Quote Post
 
Start new topic
Odpowiedzi
mortus
post
Post #2





Grupa: Zarejestrowani
Postów: 2 178
Pomógł: 596
Dołączył: 25.09.2009
Skąd: Piwniczna-Zdrój

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


Dwa razy rozpoczynasz sekcję <html>, w kodzie masz
  1. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="pl" lang="pl">
  2.  
  3.  
Usuń ten drugi znacznik <html>.
Co do polskich znaków, w sekcji <head></head> masz coś takiego
  1. <http charset="iso-8859-2"" content="text/html" equiv="Content-Type"></http>
No a czegoś takiego w XHTML-u nie ma. Powinno raczej być
  1. <meta http-equiv="Content-Type" content="text/html;charset=iso-8859-2" />

W znaczniku body masz background="tlo_strona.jpg", a to powinno się raczej znaleźć w css-ie, bo w znaczniku body nie ma atrybutu background
  1. body {
  2. background-image: url("tlo_strona.jpg");
  3. }


W <div id="strona"> w pierwszej tabeli i pierwszej komórce (<td>) masz valign="medium", a chyba chodziło Ci o valign="middle".

W dokumencie może być tylko jedna sekcja <head>, tymczasem Ty dodajesz <head> przed <div id="reszta">, żeby wstawić style. Weź wstaw
  1. <link href="index.css" type="text/css" rel="stylesheet" />
w sekcji <head> na początku strony, a stąd (z przed <div id="reszta">) w ogóle to usuń.

Znacznik końca linii wygląda tak <br/>, a nie tak </br>.

Na razie popraw to, o czym wspomniałem powinieneś się pozbyć kilkunastu, albo kilkudziesięciu błędów z pośród 67, które masz.

EDIT:
Jeżeli projektujesz stronę, to najlepiej projektuj ją pod inną przeglądarką (np. pod Firefox-em), ponieważ Internet Explorer nie trzyma się standardów ustanowionych przez W3C. Stronę do Internet Explorera można dostosować później, korzystając z pewnych tricków (hack-ów) w css.

Ten post edytował mortus 29.03.2010, 08:43:27
Go to the top of the page
+Quote Post

Posty w temacie


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

 



RSS Aktualny czas: 11.10.2025 - 01:54