Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: Kolor czcionki vs div i css
Forum PHP.pl > Forum > Po stronie przeglądarki
majestiq
5.03.2007, 13:46:43
Witam,

Na początek podam kod html i css:

[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" xml:lang="en" lang="en">
  3. <head><title>Tytuł</title>
  4. <link rel="stylesheet" type="text/css" href="style.css" />
  5.  
  6. <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
  7. <meta name="MSSmartTagsPreventParsing" content="TRUE" />
  8. <meta http-equiv="expires" content="-1" />
  9. <meta http-equiv= "pragma" content="no-cache" />
  10. <meta name="robots" content="all" />
  11. <meta name="author" content="Owen Briggs" />
  12. </head><body>
  13.  
  14.  
  15. <div id="top">
  16.  
  17. <p>JAKIS TYTUL</p>
  18.  
  19. </div>
  20.  
  21. <div id="left">
  22.  
  23. <p>1</p>
  24.  
  25. </div>
  26.  
  27.  
  28. <div id="leftmiddle">
  29.  
  30. <p>Darmowy Rozdział</p> 
  31. </div>
  32.  
  33.  
  34. <div id="middle">
  35.  
  36. <pre>
  37. blablabla
  38. </pre>
  39.  
  40.  
  41.  
  42. </div>
  43.  
  44. <div id="right">
  45.  
  46. <p class="promocja">divs</p>
  47.  
  48. </div>
  49.  
  50. <div id="rightmiddle">
  51.  
  52. <p>right</p>
  53.  
  54. </div>
  55.  
  56.  
  57. </body>
  58.  
  59. </html>
[HTML] pobierz, plaintext 



[HTML] pobierz, plaintext 
  1. body {
  2. 	margin: 0px 0px 0px 0px;
  3. 	padding: 0px 0px 0px 0px;
  4. 	font-family: verdana, arial, helvetica, sans-serif;
  5. 	color: #ccc;
  6. 	background-color: #333;
  7. 	}
  8. a {
  9. 	text-decoration: none;
  10. 	font-weight: bold;
  11. 	color:  #ccc;
  12. 	outline: none;
  13. 	}
  14. a:visited {
  15. 	color:  #ccc;
  16. 	}
  17. a:active {
  18. 	color:  #ccc;
  19. 	}
  20. a:hover {
  21. 	color: #ccc;
  22. 	text-decoration: underline;
  23. 	}
  24. .ahem {
  25. 	display: none;
  26. 	}
  27. strong, b {
  28. 	font-weight: bold;
  29. 	}
  30. p {
  31. 	font-size: 12px;
  32. 	line-height: 22px;
  33. 	margin-top: 20px;
  34. 	margin-bottom: 10px; 
  35. 	}
  36.  
  37.  
  38.  
  39. h1 {
  40. 	font-size: 24px;
  41. 	line-height: 44px;
  42. 	font-weight: bold;
  43. 	margin-top: 0;
  44. 	margin-bottom: 0;
  45. 	}
  46. h2 {
  47. 	font-size: 18px;
  48. 	line-height: 40px;
  49. 	font-weight: bold;
  50. 	margin-top: 0;
  51. 	margin-bottom: 0;
  52. 	}
  53. h3 {
  54. 	font-size: 16px;
  55. 	line-height: 22px;
  56. 	font-weight: bold;
  57. 	margin-top: 0;
  58. 	margin-bottom: 0;
  59. 	}
  60. h4 {
  61. 	font-size: 14px;
  62. 	line-height: 26px;
  63. 	font-weight: bold;
  64. 	margin-top: 0;
  65. 	margin-bottom: 0;
  66. 	}
  67. h5 {
  68. 	font-size: 12px;
  69. 	line-height: 22px;
  70. 	font-weight: bold;
  71. 	margin-top: 0;
  72. 	margin-bottom: 0;
  73. 	}
  74. h6 {
  75. 	font-size: 10px;
  76. 	line-height: 18px;
  77. 	font-weight: bold;
  78. 	margin-top: 0;
  79. 	margin-bottom: 0;
  80. 	}
  81. img {
  82. 	border: 0;
  83. 	}
  84. .nowrap {
  85. 	white-space: nowrap;
  86. 	font-size: 10px;
  87. 	font-weight: bold;
  88. 	margin-top: 0;
  89. 	margin-bottom: 0;
  90. /* must be combined with nobr in html for ie5win */
  91. 	}
  92. .tiny {
  93. 	font-size: 9px;
  94. 	line-height: 16px;
  95. 	margin-top: 15px;
  96. 	margin-bottom: 5px; 
  97. 	}	
  98.  
  99. .promocja {
  100. 	font-family: arial;
  101. 	font-color: #ff0000;
  102.  
  103. 	}
  104.  
  105.  
  106. #top {
  107. 	margin: 20px 190px 0px 190px;
  108. 	padding: 10px;
  109. 	text-align:center;
  110. 	border: 5px solid #ccc;
  111. 	background: #666;
  112. 	height: 100px; /* ie5win fudge begins */
  113. 	voice-family: "\"}\"";
  114. 	voice-family:inherit;
  115. 	height: 70px;
  116. 	}
  117. html>body #top {
  118. 	height: 70px; /* ie5win fudge ends */
  119. 	}
  120.  
  121. #left {
  122. 	position: absolute;
  123. 	top: 120px;
  124. 	left: 0px;
  125. 	margin: 190px;
  126. 	padding: 10px;
  127. 	border: 5px solid #ccc;
  128. 	background: #666;
  129. 	width: 120px; /* ie5win fudge begins */
  130. 	voice-family: "\"}\"";
  131. 	voice-family:inherit;
  132. 	height: 60px;
  133. 	}
  134. html>body #left {
  135. 	width: 120px; /* ie5win fudge ends */
  136. 	height: 60px;
  137. 	}
  138.  
  139. 	#leftmiddle p {
  140. 	margin-top: 0px;
  141. 	font-family: helvetica;
  142. 	text-align: center;
  143. 	font-color: 666;
  144. 	 }
  145.  
  146. 	#leftmiddle {
  147. 	position: absolute;
  148. 	top: 250px;
  149. 	left: 0px;
  150. 	margin: 190px;
  151. 	padding: 10px;
  152. 	border: 5px solid #ccc;
  153. 	background: #666;
  154. 	width: 120px; /* ie5win fudge begins */
  155. 	voice-family: "\"}\"";
  156. 	voice-family:inherit;
  157. 	height: 60px;
  158. 	}
  159. html>body #leftmiddle {
  160. 	width: 120px; /* ie5win fudge ends */
  161. 	height: 60px;
  162. 	}
  163.  
  164.  
  165.  
  166. #middle {
  167. 	margin: 30px 190px 20px 190px;
  168. 	padding: 10px;
  169. 	border: 5px solid #ccc;
  170. 	text-align:center;
  171.  
  172. 	}
  173.  
  174.  
  175.  
  176. #right {
  177. 	position: absolute;
  178. 	top: 120px;
  179. 	right: 0px; /* Opera5.02 will show a space at right when there is no scroll bar */
  180. 	margin: 60px;
  181. 	padding: 10px;
  182. 	border: 5px solid #ccc;
  183. 	background: #666;
  184. 	width: 150px; /* ie5win fudge begins */
  185. 	voice-family: "\"}\"";
  186. 	voice-family:inherit;
  187. 	width: 120px;
  188. 	}height: 80px;
  189. html>body #right {
  190. 	width: 120px; /* ie5win fudge ends */
  191. 	}
  192.  
  193.  
  194. #right p {
  195. 	margin-top: 0px;
  196. 	font-family: helvetica;
  197. 	text-align: center;	
  198. 	}
  199.  
  200. 	#rightmiddle {
  201. 	position: absolute;
  202. 	top: 220px;
  203. 	right: 0px; /* Opera5.02 will show a space at right when there is no scroll bar */
  204. 	margin: 60px;
  205. 	padding: 10px;
  206. 	border: 5px solid #ccc;
  207. 	background: #666;
  208. 	width: 150px; /* ie5win fudge begins */
  209. 	voice-family: "\"}\"";
  210. 	voice-family:inherit;
  211. 	width: 120px;
  212. 	}height: 80px;
  213. html>body #right {
  214. 	width: 120px; /* ie5win fudge ends */
  215. 	}
  216.  
  217.  
  218.  
  219. pre {
  220. 	font-size: 12px;
  221. 	line-height: 22px;
  222. 	margin-top: 20px;
  223. 	margin-bottom: 10px; 
  224. 	}
[HTML] pobierz, plaintext



No i chodzi o to, żeby zdefiniować kolor czcionki dla <P> zawartego w "Divs"

[HTML] pobierz, plaintext 
  1. <div id="right">
  2.  
  3. <p class="promocja">divs</p>
  4.  
  5. </div>
[HTML] pobierz, plaintext


no i nie chce mi to zadziałać nawet jak zamiast class="promocja" daje bezpośrednio style="font-color: #FF0000;" ,
nie mówiąc już o rozwiązaniu w stylu #right p

Dlaczego tak się dzieje?
Czyżby nastepowało tu jakieś dziedziczenie atrybutów z body ?
nospor
5.03.2007, 14:10:19
nie ma czegos takiego jak font-color to i ci nie dziala. Jest samo color smile.gif
majestiq
5.03.2007, 14:31:44
Heheh, rzeczywiście
Ale przecież zawsze było font-color winksmiley.jpg
Dzieki za pomoc !
remik09
6.03.2007, 09:30:27
zawsze winksmiley.jpg ale to w html-u a nie css i stad ta roznica

PS zamieszczac tyle kodu zeby rozwiazac taki problem..
majestiq
7.03.2007, 14:55:04
Myślałem, że to jakiś błąd w treści kodu - dlatego go podałem tongue.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.