Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [HTML][CSS] Tło w div.....
Forum PHP.pl > Forum > Przedszkole
krzychu0808
18.08.2008, 11:01:30
Witam.... mam pewien problem bo ustawiłem tło w głównym div strona... żeby zawsze ono było ale go niema... zobaczcie sami kiedy pole z treścią jest za krótkie dzieje się tak:

tam pod polem gdzie pisze strona w budowie powinno być szare tło w IE 6.0 jest w FF niema....
CSS:
[HTML] pobierz, plaintext 
  1. #strona {
  2. 	width:942px;
  3. 	margin:auto;
  4. 	background-color: #1b1b19;
  5. }
  6. .strona {
  7. 	background-color: #1b1b19;
  8. 	width:942px;
  9. 	margin:auto;
  10. 	float:left;
  11. }
  12. <div id="strona">
  13. <div class="strona">
  14. ..........................
  15. Cała strona
  16. ...........................
  17. </div></div>
[HTML] pobierz, plaintext
rzymek01
18.08.2008, 12:08:54
wiem o co ci chodzi smile.gif

a gdzie dajesz ten obrazek-tlo, w body?

usuń ten div class strona, bo robi to samo co div wyżej, i ten float:left, tez nie wiem po co

PS. daj pełniejszy kod, może byc na PW smile.gif
krzychu0808
18.08.2008, 12:40:34 
[HTML] pobierz, plaintext 
  1. <style type="text/css">
  2. * { margin: 0px; padding: 0px; }
  3. body {
  4. background : url(./images/tlo.png);
  5. font-family:Verdana, Arial, Helvetica, sans-serif;
  6. }
  7. #strona {
  8. 	width:942px;
  9. 	margin:auto;
  10. 	background-color: #1b1b19;
  11. }
  12. .heder {
  13. 	width:942px;
  14. 	height: 192px;
  15. 	margin:auto;
  16. 	float:left;
  17.     background : url(./images/1_03.jpg);
  18.  
  19. }
  20. .menu {
  21. 	width:942px;
  22. 	height: 33px;
  23. 	margin:auto;
  24. 	float:left;
  25.  
  26. }
  27. img {
  28. 	padding:0px;
  29. 	margin:0px;
  30. 	border: 0px;
  31. 	float:left;
  32. }
  33. .odstep {
  34. 	width:942px;
  35. 	height: 16px;
  36. 	margin: 0px;
  37. 	float:left;
  38. 	background-color: #1b1b19;
  39.  
  40. }
  41.  
  42.  
  43.  
  44. .lewa {
  45. 	width: 271px;
  46. 	float:left;
  47. 	margin: auto;
  48. 	background-color: #1b1b19;
  49. }
  50.  
  51. .prawa {
  52. 	width:665px;
  53. 	float:left;
  54. 	margin: auto;
  55. 	background-color: #1b1b19;
  56. }
  57.  
  58. .menu_lewa {
  59. 	width: 271px;
  60. 	height: 31px;
  61. 	margin:auto;
  62. 	float:left;
  63. 	background : url(./images/1_14.jpg);
  64. }
  65.  
  66. .menu_prawa {
  67. 	width:665px;
  68. 	height: 31px;
  69. 	margin:auto;
  70. 	float:left;
  71. 	background : url(./images/1_15.jpg);
  72. }
  73. .menu_prawa_news {
  74. 	width:665px;
  75. 	height: 31px;
  76. 	margin:auto;
  77. 	float:left;
  78. 	background : url(./images/news.jpg);
  79. }
  80. .menu_prawa1 {
  81. 	margin-left :60px;
  82. 	margin-top :10px;
  83. 	padding : 0px;
  84. 	float : left;
  85. 	display: inline;
  86. 	color: #f17e31;
  87.     font-family: tahoma;
  88.     font-size: 13px;
  89.     font-weight: bold;
  90.  
  91. }
  92.  
  93. .menu_lewa_tresc {
  94. 	width: 271px;
  95. 	height: 220px;
  96. 	margin:auto;
  97. 	float:left;
  98. 	background : url(./images/1_16.jpg);
  99. }
  100.  
  101. .menu_prawa_tresc {
  102. 	width:665px;
  103. 	margin:auto;
  104. 	float:left;
  105. 	background : url(./images/1_17.jpg);
  106. 	color: #757575;
  107.     font-family: tahoma;
  108.     font-size: 11px;
  109. }
  110.  
  111. .menu_prawa_tresc1 {
  112. 	margin-left :30px;
  113. 	margin-top :5px;
  114. 	padding : 0px;
  115. 	float : left;
  116. 	display: inline;
  117. 	color: #757575;
  118.     font-family: tahoma;
  119.     font-size: 11px;
  120. }
  121.  
  122.  
  123. .menu_lewa_dol {
  124. 	width: 271px;
  125. 	height: 16px;
  126. 	float:left;
  127. 	background : url(./images/1_24.jpg);
  128. 	margin: 0px; padding: 0px;
  129.  
  130.  
  131. }
  132.  
  133. .menu_prawa_dol {
  134. 	width:665px;
  135. 	height: 16px;
  136. 	float:left;
  137. 	background : url(./images/1_22.jpg);
  138. 	margin: 0px; padding: 0px;
  139.  
  140.  
  141. }
  142. .odstep2 {
  143. 	width:941px;
  144. 	height: 16px;
  145. 	margin: 0px;
  146. 	float:left;
  147. 	background-color: #1b1b19;
  148. }
  149. .stopka {
  150. 	width:942px;
  151. 	height: 35px;
  152. 	margin:auto;
  153. 	float:left;
  154. 	background : url(./images/1_26.jpg);
  155. 	display: inline;
  156. 	position: relative;
  157. }
  158. .logowanie {
  159. 	margin-left :720px;
  160. 	margin-top :70px;
  161. 	padding : 0px;
  162. 	float : left;
  163. 	display: inline;
  164. 	color: #d35900;
  165.     font-family: tahoma;
  166.     font-size: 13px;
  167.  
  168. }
  169.  
  170. .logowanie1 {
  171. 	margin-left :43px;
  172. 	margin-top :10px;
  173. 	float : left;
  174. 	display: inline;
  175.  
  176. }
  177. .logowanie2 {
  178. 	color: #d35900;
  179.     font-family: tahoma;
  180.     font-size: 11px;
  181.  
  182. }
  183. .logowanie_blad {
  184. 	float : left;
  185. 	color: #ff0000;
  186.     font-family: tahoma;
  187.     font-size: 11px;
  188.  
  189. }
  190. input {
  191.   border : 1px solid #cccccc;
  192.    background-color : #343434;
  193.   color: #e1e1e1;
  194.   font-family : Verdana, serif;
  195.   font-size : 11px;
  196.   font-weight : normal;
  197.  
  198. }
  199. textarea {
  200.   background-color : #343434;
  201.   color: #e1e1e1;
  202.   font-family : Verdana, serif;
  203.   font-size : 11px;
  204.   font-weight : normal;
  205.   border-color : #cccccc;
  206.   border-style : solid;
  207.   border-width : 1px;
  208. }
  209. select {
  210.   background-color : #343434;
  211.   color: #e1e1e1;
  212.   font-family : Verdana, serif;
  213.   font-size : 11px;
  214.   font-weight : normal;
  215.   border-color : #cccccc;
  216.   border-style : solid;
  217.   border-width : 1px;
  218. }
  219. .blad1 {
  220. 	color: #ff0000;
  221.     font-family: tahoma;
  222.     font-size: 11px;
  223. }
  224. a.link1 {
  225. text-decoration: none;
  226. color: #d35900;
  227. }
  228. :hover.link1  {
  229. text-decoration: none;
  230. color: #343434;
  231. }
  232. </style>
  233. </head>
  234. <body>
  235.  
  236.  
  237.  
  238.  
  239.  
  240.  
  241.  
  242. <div id="strona">
  243. <div class="strona">
  244. <div class="heder">
  245. <? include("./logowanie.php"); ?>
  246. </div>
  247. <div class="menu">
  248. <img alt="tutoriale.elaz.eu" src="./images/1_05.jpg">
  249. <a href="index.php"><img alt="tutki" title="Strona Główna" src="./images/1_06.jpg"></a>
  250. <img alt="tutoriale" title="Forum" src="./images/1_07.jpg">
  251. <img alt="photoshop" title="Download" src="./images/1_08.jpg">
  252. <img alt="tutoriale photoshop" title="Tutoriale" src="./images/1_09.jpg">
  253. <img alt="tutorial" title="Dodaj Tutoriala" src="./images/1_10.jpg">
  254. <a href="index.php?action=rejestracja"><img alt="rejestracja" title="Rejestracja" src="./images/1_11.jpg"></a>
  255. <img alt="tut"  src="./images/1_12.jpg">
  256. </div> 
  257. <div class="odstep"></div>
  258. <div class="lewa"> 
  259.  
  260. <div class="menu_lewa"></div>
  261. <div class="menu_lewa_tresc"></div>
  262. <div class="menu_lewa_dol"></div>
  263.  
  264.  
  265. </div> 
  266.  
  267. <div class="prawa">
  268. <?php include("./podstrony_prawa.php");
  269. ?>
  270. </div> 
  271. <div class="odstep2"></div>
  272. <div class="stopka"></div>
  273. </div> 
  274. </div> 
  275. </body>
  276. </html>
[HTML] pobierz, plaintext
rzymek01
18.08.2008, 13:41:38
ten css mi się nie podoba, wszędzie margin:auto, i float:left smile.gif

rozwiązanie to dodanie przed
Kod
<div class="odstep2"></div>


tego:
Kod
<div style="clear:both;"></div>


PS. pamiętaj, że jak chcesz wyśrodkowac stronę w IE to musisz dać div'a (wyżej od containera) ze stylem text-align:center; smile.gif
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.