Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: Ucina stronę
Forum PHP.pl > Forum > Po stronie przeglądarki > CSS
pspgor
17.04.2011, 14:10:31
Witam. Mam pewien problem, gdyż stronę mi po prostu ucina.
Szukałem błędu spory kawałek czasu, bez skutku.

Zapodaję kod.

html:
[HTML] pobierz, plaintext 
  1. <body>
  2. <div id="wrapper">
  3. <!-- TOP --->
  4. <div id="top">
  5. <div id="logo"><a href="index.html"><img src="images/logo.png" border="0" alt="Strona Główna" title="Strona Główna" /></a></div>
  6. <div id="menu"></div>
  7. </div>
  8. <!-- /TOP --->
  9. <!-- CONTENT --->
  10. <!-- SHAPE1 --->
  11. <div id="shape1">
  12. <div id="shape1_left">
  13. <img class="drobneinfo" src="images/drobneinfo.png" border="0" alt="Drobne info ..." title="Drobne info ..." />
  14. <p>It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout. The point of using Lorem Ipsum is that it has a more-or-less normal distribution of letters, as opposed to using 'Content here, content here, making it look like readable English.</p>
  15. <div class="buttons">
  16. <a href="#"><img src="images/button1.png" border="0" alt="Zobacz stronę" title="Zobacz stronę" /></a>
  17. <a href="#"><img src="images/button2.png" border="0" alt="Zobacz portfolio" title="Zobacz portfolio" /></p></a>
  18. </div></div>
  19. <div id="shape1_right"><img src="images/borderbig.png" border="0" alt="Foto" title="Zdjęcie" /></div>
  20. </div>
  21. <!-- /SHAPE1 --->
  22. <div id="spinacze"></div></div>
  23. <!-- SHAPE2 --->
  24. <div id="wrapper2">
  25. <div id="arrow_left"><img src="images/arrow_l.png" border="0" alt="Poprzednie" title="Poprzednie" /></div>
  26. <div id="shape2"></div>
  27. <div id="arrow_right"><img src="images/arrow_r.png" border="0" alt="Następne" title="Następne" /></div>
  28. </div>
  29. <!-- /SHAPE2 --->
  30. <!-- /CONTENT --->
  31. <div id="footer">sadasjdaipsdj</div>
  32. </body>
[HTML] pobierz, plaintext


css:

[HTML] pobierz, plaintext 
  1. @charset "utf-8";
  2. /* CSS Document */
  3. body {
  4. 	font-family: "Verdana", "Arial", "Tahoma";
  5. 	font-size: 14px;
  6. 	color: #f4f4f4;
  7. 	background: #252118;
  8. 	overflow: hidden;
  9. }
  10. #wrapper {
  11. 	margin: -10px auto;
  12. 	width: 936px;
  13. }
  14. #top {
  15. 	 height: 181px;
  16. 	 background: url('../images/top_bg.png') no-repeat;
  17. }
  18. #logo {
  19. 	width: 229px;
  20. 	height: 73px;
  21. 	padding-left: 69px;
  22. 	padding-top: 52px;
  23. }
  24. #menu {	
  25. }
  26.  
  27. #shape1 {
  28. 	background: url('../images/shape1.png') no-repeat;
  29. 	width: 936px;
  30. 	height: 292px;
  31. 	position: relative;
  32. 	z-index: 0;
  33. }
  34. #shape1_left {
  35. 	float: left;
  36. 	width: 420px;
  37. 	margin-left: 54px;
  38. 	margin-top: 17px;
  39. }
  40. #shape1_left .drobneinfo {
  41. 	border: 0px;
  42. }
  43. #shape1_left p {
  44. 	width: 410px;
  45. 	height: 135px;
  46. 	text-shadow: black 1px 1px;
  47. }
  48. #shape1_left .buttons {
  49. 	margin-left: 95px;
  50. 	margin-top: -30px;
  51. }
  52. #shape1_right {
  53. 	float: right;
  54. 	width: 409px;
  55. 	height: 310px;
  56. 	padding-right: 40px;
  57. 	margin-top: -40px;
  58. 	overflow: hidden;
  59. }
  60. #spinacze {
  61. 	margin: -10px 10px;
  62. 	background: url('../images/spinacz.png') repeat;
  63. 	width: 936px;
  64. 	height: 34px;
  65. 	position: relative;
  66. 	z-index: 1;
  67. 	overflow: hidden;
  68. }
  69. #wrapper2 {
  70. 	margin: 0px auto;
  71. 	width: 1077px;
  72. }
  73. #arrow_left {
  74. 	width: 62px;
  75. 	height: 91px;
  76. 	padding-top: 100px;
  77. 	float: left;
  78. 	padding-right: 7px;
  79. }
  80. #shape2 {
  81. 	float: left;
  82. 	width: 936px;
  83. 	height: 292px;
  84. 	background: #e9e9e9;
  85. 	position: relative;
  86. 	z-index: 0;
  87. }
  88. #arrow_right {
  89. 	width: 62px;
  90. 	height: 91px;
  91. 	float: left;
  92. 	padding-top: 100px;
  93. 	padding-left: 7px;
  94. }
  95. #footer {
  96. 	background: #000;
  97. 	height: 100px;
  98. 	width: 500px;
  99. 	float: right;
  100.  
  101. }
[HTML] pobierz, plaintext


Z góry dziękuję za wypatrzenie mojego błędu.
Pozdrawiam.
jaslanin
17.04.2011, 17:58:54
Podaj link do strony testowej lub spakuj ją i wyślij na jakiś serwer. Nawet spróbowałem wstawić kod HTML i CSS u siebie na komputerze ale bez obrazków trudno się zorientować co jest nie tak.

Narazie mogę doradzić Ci tylko zapoznanie się ze stroną: http://www.kurshtml.edu.pl/html/ramy_dokumentu,zielony.html i zapoznanie się z właściwymi ramami dokumentu. Brakuje Ci bowiem deklaracji typu dokumentu oraz tagu <HTML></HTML>
pspgor
19.04.2011, 16:32:56
Już dałem radę.

Wystarczyło usunąć "overflow: hidden;" z sekcji body.
o tagach "html" nie zapomniałem tylko ich po prostu nie dałem.
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.