Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

> [PHP][CSS] DIV, Problem podzielenia layout'u.
radi.
post
Post #1





Grupa: Zarejestrowani
Postów: 7
Pomógł: 0
Dołączył: 23.02.2011
Skąd: Okolice Tarnowa

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

Witajcie. Zacznę od tego, że jestem nowym użytkownikiem. W tematyce PHP dopiero raczkuje więc moje pytanie dla kogoś może wydać się bardzo banalne, a ja sam męczę się drugi dzień nad rozwiązaniem swojego problemu. Otóż zrobiłem layout w photoshopie, pociąłem go odpowiednio i teraz zaczynają się schodki. Chciałbym ogarnąć go za pomocą DIV'ów, jednak moja wiedza nie pozwala jeszcze na swobodne manewrowanie nimi.

www.radk.cba.pl/test.php - tak to właśnie wygląda. Pod FF jest ok oprócz paska po prawej stronie który po zmienieniu rozdzielczości okna po prostu "wchodzi" na pozostałą część.
Jednak gdy odpalę stronę na IE to dzieją się cuda. DIV "Tresc" zjeżdża na sam dół.

Gdy "postawiłem na sucho" w ramkach layout bez żadnego kodu to było wszystko ok oprócz tego paska po prawej stronie. Jednak gdy w treści zrobiłem ramkę lokalną to nie wyświetla mi odpowiednio "Kontener 1 - Stopka - Kontener 2". W czym tkwi problem? Ramka lokalna jest zabroniona? W takim razie w jaki sposób mogę zrobić by po kliknięciu w odpowiedni link strona ładowała się w Div "Treść" ?


Zamieszczam odpowiednio dwa kody:

1 - styl.css

[PHP] pobierz, plaintext 
  1. html, body {
  2. 	background-color: #103242;
  3. 	color: white;
  4. 	margin: 0;
  5. 	padding: 0;
  6. }
  7. #top
  8. {
  9. 	margin-left: 20%;
  10.  
  11. }
  12. #NAGLOWEK {
  13. 	background-image: url(Obrazki/baner.gif);
  14. 	height: 207px;
  15. 	width: 820px;
  16. }
  17.  
  18. #LEWA {
  19. 	width: 100px;
  20. 	height: 1020px;
  21. 	float: left;
  22. 	overflow: hidden;
  23. 	position: relative;
  24. 	margin-left: -100px;
  25. 	margin-top: -207px;
  26. 	background-image: url(Obrazki/lewa.gif);
  27. }
  28.  
  29. #PRAWA {
  30. 	width: 100px;
  31. 	height: 1020px;
  32. 	float: right;
  33. 	overflow: hidden;
  34. 	position: static;
  35. 	margin-right: 90px;
  36. 	margin-top: -207px;
  37. 	background-image: url(Obrazki/prawa.gif);
  38. }
  39.  
  40. #MENU {
  41. 	background-image: url(Obrazki/menu.gif);
  42. 	width: 820px;
  43. 	height: 91px;
  44.  
  45. }
  46.  
  47. #TRESC {
  48.         padding-top: 1cm;
  49.         padding-left: 2cm;
  50. 	background-image: url(Obrazki/tresc.gif);
  51. 	width: 820px;
  52. 	height: 512px;
  53.         color: white;
  54.  
  55. }
  56.  
  57. #KONTENER1{
  58. 	background-image: url(Obrazki/kontener1.gif);
  59. 	width:820px;
  60. 	height:38px;
  61. }
  62. #STOPKA{
  63. 	background-image: url(Obrazki/stopka.gif);
  64. 	width:820px;
  65. 	height:45px;
  66. 	text-align:center;
  67.  
  68.  
  69. }
  70.  
  71. #KONTENER2 {
  72. 	background-image: url(Obrazki/kontener2.gif);
  73. 	width:820px;
  74. 	height:89px;
  75. }
  76.  
  77.  
  78.  
  79.  
[PHP] pobierz, plaintext


2. - główna strona

[PHP] pobierz, plaintext 
  1. <HTML>
  2. <head> 
  3. <link rel="stylesheet" href="styl.css" type="text/css" media="screen" /> 
  4. </head> 
  5. <BODY>
  6.  
  7.  
  8. <div id="top">
  9.  
  10.         <div id="NAGLOWEK"></div>
  11. 	<div id="LEWA"></div>
  12. 	<div id="PRAWA"></div>
  13. 	<div id="MENU"></div>
  14. 	<div id="TRESC"><iframe name="strona" width="650px" height="400px" src="wysw_new.php" frameborder="0" /></div>
  15.         <div id="KONTENER1"></div>
  16.         <div id="STOPKA"></div>
  17.         <div id="KONTENER2"></div>
  18.  
  19.  
  20. </div>
  21.  
  22. </BODY>
  23. </HTML>
[PHP] pobierz, plaintext



Prosiłbym bardzo o pomoc, chciałbym ruszyć dalej z pracami, ale nie mogę poradzić sobie z tym problemem. Mam nadzieję, że napisałem wszystko jasno. Dziękuje z góry za pomoc i wszelakie podpowiedzi.

Pozdrawiam radi.
Go to the top of the page
+Quote Post
 
 Start new topic
Odpowiedzi
kokers
post
Post #2





Grupa: Zarejestrowani
Postów: 154
Pomógł: 33
Dołączył: 18.10.2010
Skąd: Katowice

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

na początek brakuje kilka meta tagów które rozsypuja kodowanie strony, dobrze jest też dodać DOCTYPE... struktura całego dokumentu powinna wyglądać mniej więcej tak:
[HTML] pobierz, plaintext 
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3. <head>
  4. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  5. <title>tytuł strony</title>
  6. </head>
  7.  
  8. <body>
  9. </body>
  10. </html>
[HTML] pobierz, plaintext


oczywiście utf-8 dajesz jeśli kodowanie pliku jest w utf8.
Natomiast widzę, że IE próbuje mi odpalić twoją stronę w trybie zgodności -> standardy IE 8, tryb osobliwości. A tryb osobliwości to nic innego jak IE6...
Dodaj dodatkowo:

[HTML] pobierz, plaintext 
  1. <meta http-equiv="X-UA-Compatible" content="IE=8">
[HTML] pobierz, plaintext

w sekcji head i wtedy wymusisz wyświetlenie w standardach IE 8
Go to the top of the page
+Quote Post

Posty w temacie
- radi.   [PHP][CSS] DIV   23.02.2011, 15:10:37
- - kokers   na początek brakuje kilka meta tagów które rozsypu...   23.02.2011, 15:33:37
- - radi.   Ok, na IE explorerze główny div o ID "Treść...   25.02.2011, 17:32:22
- - cniak   Sorry, ale nie chce mi się tego błędu rozpatrywać,...   25.02.2011, 20:26:58
- - kokers   czemu ładujesz tekst poprzez iframe? Nie lepiej ja...   25.02.2011, 20:53:57

« Następny starszy · Przedszkole · Następny nowszy »
 

Reply to this topicStart new topic
2 Użytkowników czyta ten temat (2 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: 18.10.2025 - 02:17
Powered By IP.Board © 2025  IPS, Inc.
All changes by PHP.pl Administrators
Hosting zapewnia NQ.pl hosting, trac, svn