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 

[PHP] pobierz, plaintext 
  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.  
[PHP] pobierz, plaintext

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

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

CSS:

[CSS] pobierz, plaintext 
  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] pobierz, plaintext


Css jest do każdej podstrony.

sciana.gif 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ąć.






--------------------
zmoderowano - waga i rozmiar
Go to the top of the page
+Quote Post
 
 Start new topic
Odpowiedzi (1 - 11)
krzysztof_kf
post
Post #2





Grupa: Zarejestrowani
Postów: 1 135
Pomógł: 158
Dołączył: 19.03.2009
Skąd: Toruń

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

może dla znacznika dd { usuń

Kod
    position: fixed; left: 0cm;


Ten post edytował krzysztof_kf 28.03.2010, 13:22:43
Go to the top of the page
+Quote Post
deadmen4
post
Post #3





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

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

ooo... pojawiło się menu. Tylko trochę zniekształcone. (żeby zobaczyć najlepiej wejść na strone)

Ale wciąż jeszcze nie trzyma odstępów, przesówa się, no i te polskie znaki.... właśnie co z nimi? :?:


--------------------
zmoderowano - waga i rozmiar
Go to the top of the page
+Quote Post
krzysztof_kf
post
Post #4





Grupa: Zarejestrowani
Postów: 1 135
Pomógł: 158
Dołączył: 19.03.2009
Skąd: Toruń

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

z menu pokombinuj z padding dla znacznika dt { a jeśli chodzi o wyświetlanie polskich znaków może byś wpisał jakąś dokumentację

Kod
<!DOCTYPE html
        PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="pl" lang="pl">
<html>
<head>
<http equiv="Content-Type" content="text/html" charset=iso-8859-2" />
<link rel="Stylesheet" type="text/css" href="index.css" />
<title>STRONA</title>
<meta name="Description" content="Skrypty, pomoce, wiadomosci, portal, wszsytko" />
<meta name="Author" content="Marox" />
<meta http-equiv="Expires" content="0" />
<meta http-equiv="Cache-Control" content="no-store, no-cache, must-revalidate" />
<meta http-equiv="Cache-Control" content="post-check=0, pre-check=0" />
<meta http-equiv="Pragma" content="no-cache" />
<link rel="Shortcut icon" href="http://www.multihack.pl/favicon.ico" />
</head>
<body>


Ten post edytował krzysztof_kf 28.03.2010, 13:52:52
Go to the top of the page
+Quote Post
deadmen4
post
Post #5





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

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

Dobra, dopisałem. Przez dokumentacje parę rzeczy musze od nowa zrobić (bo tak jakby znikły) , ale tam... nie dużo. Polskich znaków niestety wciąż nie ma.

Tylko wciąż wszystko jest zbite i porozrzucane (podstrony), i jeszcze na dodatek sonda wjechała na góre!
ohmy.gif

W IE wszystko gra....


--------------------
zmoderowano - waga i rozmiar
Go to the top of the page
+Quote Post
krzysztof_kf
post
Post #6





Grupa: Zarejestrowani
Postów: 1 135
Pomógł: 158
Dołączył: 19.03.2009
Skąd: Toruń

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

po co masz puste divy ? typu
Kod
<div id="sonda56676">
Go to the top of the page
+Quote Post
deadmen4
post
Post #7





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

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

Tego ta sonda wymagała... :/


--------------------
zmoderowano - waga i rozmiar
Go to the top of the page
+Quote Post
krzysztof_kf
post
Post #8





Grupa: Zarejestrowani
Postów: 1 135
Pomógł: 158
Dołączył: 19.03.2009
Skąd: Toruń

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

dodaj jakis selektor

Kod
#sonda {
float: left;
}

<div id="sonda">
// umesc w miejscu przed <div id="sonda56676">
Go to the top of the page
+Quote Post
neo1986kk
post
Post #9





Grupa: Zarejestrowani
Postów: 561
Pomógł: 3
Dołączył: 2.02.2009

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

napewno pomoże Ci Firebug dla FF
Go to the top of the page
+Quote Post
deadmen4
post
Post #10





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

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

OK. Z sondą jest all ok.

Reszta wciąż beznadzieja... :[
Da się coś wogóle zrobić, jest szansa?


--------------------
zmoderowano - waga i rozmiar
Go to the top of the page
+Quote Post
krzysztof_kf
post
Post #11





Grupa: Zarejestrowani
Postów: 1 135
Pomógł: 158
Dołączył: 19.03.2009
Skąd: Toruń

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

z czym masz jeszcze problem rozwiń temat smile.gif
Go to the top of the page
+Quote Post
mortus
post
Post #12





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
[HTML] pobierz, plaintext 
  1. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="pl" lang="pl">
  2.  
  3.  
  4. <html>
[HTML] pobierz, plaintext
Usuń ten drugi znacznik <html>.
Co do polskich znaków, w sekcji <head></head> masz coś takiego
[HTML] pobierz, plaintext 
  1. <http charset="iso-8859-2"" content="text/html" equiv="Content-Type"></http>
[HTML] pobierz, plaintext
No a czegoś takiego w XHTML-u nie ma. Powinno raczej być
[HTML] pobierz, plaintext 
  1. <meta http-equiv="Content-Type" content="text/html;charset=iso-8859-2" />
[HTML] pobierz, plaintext

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
[CSS] pobierz, plaintext 
  1. body {
  2.     background-image: url("tlo_strona.jpg");
  3. }
[CSS] pobierz, plaintext


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
[HTML] pobierz, plaintext 
  1. <link href="index.css" type="text/css" rel="stylesheet" />
[HTML] pobierz, plaintext
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
« Następny starszy · Przedszkole · 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 · Linearny+ · Przełącz na: Drzewo

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

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