Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

 
Reply to this topicStart new topic
> [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

  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.  


2. - główna strona

  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>



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
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:
  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. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  4. <title>tytuł strony</title>
  5. </head>
  6.  
  7. </body>
  8. </html>


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:

  1. <meta http-equiv="X-UA-Compatible" content="IE=8">

w sekcji head i wtedy wymusisz wyświetlenie w standardach IE 8


--------------------
‎"Sometimes you're gonna get odd error syntax, unexpected T_PAAMAYIM_NEKUDOTAYIM and you're like, what in the world is that thing i have no idea what went wrong in my code. In english that error means you screwed up the references to an object" Kevin Skoglund
Drobna prywata: Ależ nie nie, nie zamierzam zmieniać płci w najbliższym czasie, więc zwracanie się do mnie per Pan jest odrobinkę nietrafione.
Go to the top of the page
+Quote Post
radi.
post
Post #3





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

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


Ok, na IE explorerze główny div o ID "Treść" już nie ucieka. Z tym, że dalej mam problem znikającego div'a Kontener,Stopka i Kontener 2 gdy w divie "Treść" umieszczę ramkę lokalną.
Go to the top of the page
+Quote Post
cniak
post
Post #4





Grupa: Zarejestrowani
Postów: 169
Pomógł: 12
Dołączył: 16.09.2009

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


Sorry, ale nie chce mi się tego błędu rozpatrywać, lecz w jednej wtopie mogę Ci pomóc:
do stylu treść dodaj wartość:
  1. background-repeat: no-repeat;


Ten post edytował cniak 25.02.2011, 20:28:26
Go to the top of the page
+Quote Post
kokers
post
Post #5





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

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


czemu ładujesz tekst poprzez iframe?
Nie lepiej jak już chcesz używać php skorzystać z funkcji np require, albo include?

Tworzysz sobie 2 standardowe pliki jak
top.php, stopka.php (czyli to co na każdej stronie się powtarza) i potem poszczególne pliki dla podstron. Ale musisz zrobić jakiś kurs, przeczytać książkę.

w iframe ładuje ci się strona cała, łącznie z jej stylami. możesz to zobaczyć tutaj: http://www.w3schools.com/tags/tryit.asp?fi...=tryhtml_iframe zmień tam adres z default.asp na np. http://onet.pl a załaduje Ci się w ramkę onet.

poczytaj tutaj: http://www.kurshtml.boo.pl/html/szablon_st...amek,ramki.html albo tutaj http://webmaster.helion.pl/index.php/php-szablony-stron-www


--------------------
‎"Sometimes you're gonna get odd error syntax, unexpected T_PAAMAYIM_NEKUDOTAYIM and you're like, what in the world is that thing i have no idea what went wrong in my code. In english that error means you screwed up the references to an object" Kevin Skoglund
Drobna prywata: Ależ nie nie, nie zamierzam zmieniać płci w najbliższym czasie, więc zwracanie się do mnie per Pan jest odrobinkę nietrafione.
Go to the top of the page
+Quote Post

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

 



RSS Aktualny czas: 21.08.2025 - 01:57