Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

> Rozjeżdzanie się pod IE
maribt
post
Post #1





Grupa: Zarejestrowani
Postów: 8
Pomógł: 0
Dołączył: 7.04.2010

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

Już mi ręce opadają:/ nie wiem w którym miejscu robię błąd, css jak i html przechodzi poprawnie validację, a mimo to IE robi fochy.

Może najpierw pokaże screeny:

kosmos w IE
tak powinna wyglądać strona

i oczywiście kod:

[HTML] pobierz, plaintext 
  1.  <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
  2.  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
  3.  <html xmlns="http://www.w3.org/1999/xhtml" lang="pl" xml:lang="pl">
  4. <head>
  5.   <meta http-equiv="Content-type" content="application/xhtml+xml; charset=iso-8859-2" />
  6.   <meta name="Description" content=" [wstaw tu opis strony] " />
  7.   <meta name="Keywords" content=" [wstaw tu slowa kluczowe] " />
  8.  
  9.   <title> Alumateq </title>
  10.  
  11.   <link href="style.css" rel="stylesheet" type="text/css" />
  12. </head>
  13. <body>
  14. <!--menu -->
  15. <div id="menu">
  16. 	<a href="http://www.alumateq.pl"><img src="images/logo.jpg" alt="Alumateq" id="llogo" /></a>
  17. 	<ul>
  18. 		<li class="active"><a href="#"><span>home</span></a></li> <!-- do aktywnego adresu należy dodać span -->
  19. 		<li class="normal"><a href="#">o firmie</a></li>
  20. 		<li class="normal"><a href="#">realizacje</a></li>
  21. 		<li class="normal"><a href="#">certyfikaty</a></li>
  22. 		<li class="normal"><a href="#">dealer</a></li>
  23. 		<li class="normal"><a href="#">kontakt</a></li>
  24. 	</ul>
  25. </div>
  26. <!-- header -->
  27. <div id="header">
  28. 	<div id="hleft">
  29. 		<h1>
  30.  
  31. 			Witamy na stronie firmy ALUMATEQ<br />
  32. 			<em>Producenta stolarki aluminiowej</em>
  33. 		</h1>	
  34. 		<p>Lorem Ipsum is simply dummy text of the printing and typesetting
  35. 			 industry. Lorem  Ipsum has been the industry's standard dummy 
  36.        text ever since the 1500s, when an unknown printer took a galley of 
  37.        type and scrambled it to make a type specimen book. It has survive d
  38.        not only five centuries, but also the leap into electronic typesetting, 
  39.        remaining essentially unchanged. It was popularised in the 1960s with
  40. 			 the release of Letraset sheets containing Lorem Ipsum passages, and 
  41.        more recently with desktop publishing software like Aldus PageMaker 
  42.        including versions of Lorem 
  43. 		</p>
  44. 		<a href="#"><img src="images/more_white.png" alt="więcej" /></a>
  45. 	</div>
  46. 	<div id="hright">
  47. 		<img src="images/img01.jpg" alt="" />
  48. 	</div>
  49. </div>
  50. <!-- oferta -->
  51. <div id="offer">
  52. 	<div id="offer_left">
  53. 		<img src="images/okno_prof.png" class="prof" alt="" />
  54. 		<h2>OKNA</h2>kjkjkjkj<br />jkjkj<br />jkjkjkj<br />jkjkf
  55. 	</div>
  56. 	<div id="offer_middle">
  57.  
  58. 	</div>
  59. 	<div id="offer_right">
  60.  
  61. 	</div>
  62. </div>
  63. </body>
  64. </html>
[HTML] pobierz, plaintext 



[HTML] pobierz, plaintext 
  1.  * {
  2. 	margin: 0;
  3. 	padding: 0;
  4. }
  5. body {
  6. 	background: #FFFFFF url(images/tlo.gif) repeat-x;
  7. 	font-family: Georgia, "Times New Roman", Times, serif;
  8. 	font-size: 13px;
  9. 	color: #666666;
  10. }
  11. img {
  12. 	border: none;
  13. }
  14.  
  15. /* Menu */
  16.  
  17.  
  18. #menu {
  19. 	width: 980px;
  20. 	height: 94px;
  21. 	margin: 0 auto;
  22. }
  23. #menu ul {
  24. 	margin: 0;
  25. 	padding: 0;
  26. 	list-style: none;
  27. }
  28. #menu .normal a {
  29. 	display: block;
  30. 	float: left;
  31. 	height: 20px;
  32. 	margin: 40px 12px 0 0;
  33. 	padding: 2px 0 0 0;
  34. 	text-decoration: none;
  35. 	text-transform: uppercase;
  36. 	text-align: center;
  37. 	font-weight: bold;
  38. 	font-family: Arial;
  39. 	font-size: 12px;
  40. 	color: #262626;
  41. }
  42.  
  43. #menu .normal a:hover {
  44. 	color: #767676;
  45. }
  46.  
  47. #menu .active a {
  48. 	background: #343434 url(images/mright.gif) right top no-repeat ;
  49. 	display: block;
  50. 	float: left;
  51. 	height: 20px;
  52. 	margin: 40px 12px 0 0;
  53. 	padding: 0px 8px 0 0;
  54. 	text-decoration: none;
  55.  
  56. }
  57. #menu span {
  58. 	background: url(images/mleft.gif) left top no-repeat;
  59. 	height: 18px;
  60. 	display: block;
  61. 	padding: 2px 0 0 8px;
  62. 	text-transform: uppercase;
  63. 	text-align: center;
  64. 	font-weight: bold;
  65. 	font-family: Arial;
  66. 	font-size: 12px;
  67. 	color: #FFFFFF;
  68. }
  69. #menu li {
  70. 	display: inline;
  71. }
  72. #menu img {
  73. 	margin: 20px 280px 24px 10px;
  74. 	float: left;
  75. }
  76.  
  77. /* Header */
  78.  
  79. #header {
  80. 	width: 980px;
  81. 	margin: 0 auto;
  82. }
  83. #hleft {
  84. 	float: left;
  85. 	width: 488px;
  86. 	height: 293px;
  87. 	background: url(images/img00.gif);
  88. }
  89. #hright {
  90. 	float: right;
  91. 	width: 492px;
  92. 	height: 293px;
  93. }
  94. h1 {
  95. 	margin: 25px 0 25px 10px;
  96. 	height: 34px;
  97. 	width: 400px;
  98. 	color: #ffffff;
  99. 	border-left: 12px solid #85C226;
  100. 	font-family: Tahoma;
  101. 	font-size: 15px;
  102. 	font-weight: bold;
  103. 	padding: 0 0 0 10px;
  104.  
  105. }
  106. h1 em {
  107. 	color: #BDBDBD;
  108. 	font-family: Tahoma;
  109. 	font-size: 11px;
  110. 	font-weight: bold;
  111. }
  112. #hleft p {
  113. 	color: #ffffff;
  114. 	font-family: verdana;
  115. 	font-size: 11px;
  116. 	font-weight: normal;
  117. 	margin: 0 45px 0 32px;
  118. }
  119. #hleft img {
  120. 	margin: 40px 45px 0 0;
  121. 	float: right;	
  122. }
  123.  
  124. /* oferta */
  125.  
  126. #offer {
  127. 	width: 980px;
  128. 	margin: 0 auto;
  129. }
  130. #offer_left {
  131. 	float: left;
  132. 	clear: left;
  133. 	width: 355px;
  134. 	height: 229px;
  135. 	margin: 10px 0 0 0;
  136. 	background: url(images/offer_left.png);
  137. }
  138. #offer_middle {
  139. 	float: left;
  140. 	clear: none;
  141. 	width: 344px;
  142. 	height: 229px;
  143. 	margin: 10px 0 0 0;
  144. 	background: url(images/offer_middle.png);
  145. }
  146. #offer_right {
  147. 	float: right;
  148. 	clear: right;
  149. 	width: 281px;
  150. 	height: 229px;
  151. 	margin: 10px 0 0 0;
  152. 	background: url(images/offer_right.png);
  153. }
  154. .prof {
  155. 	margin: 60px 10px 40px 5px;
  156. 	display: inline;
  157. 	float: left;
  158. 	clear: left;
  159. }
  160. #offer h2 {
  161. 	background: url(images/plus.png) no-repeat left;
  162. 	padding: 0 0 0 12px;
  163. 	margin: 30px 0 10px 71px;
  164. 	color: #85C226;
  165. 	font-family: Tahoma;
  166. 	font-weight: bold;
  167. 	font-size: 19px; 
  168. }
[HTML] pobierz, plaintext


Ten post edytował maribt 7.04.2010, 00:30:46
Go to the top of the page
+Quote Post
 
 Start new topic
Odpowiedzi
AdIoS_Neo
post
Post #2





Grupa: Zarejestrowani
Postów: 159
Pomógł: 43
Dołączył: 8.03.2009

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

Witam, po ss widzę, że chodzi o IE6 ? Na pocieszenie powiem Ci, iż w IE8 wygląda wszystko normalnie tak jak w ff. Niestety nie mam IE6 więc nie mogę nic sam zdziałać. Patrzyłeś na górną belkę menu ? W IE6 jest tylko jeden przycisk, gdzie reszta ? Może one gdzieś wskoczyły pod obrazek i obniżyły resztę strony. Btw. standardy W3C i IE6 ? ;d nieeee to nie ta bajka ^^ polecam dodać kilka osobnych reguł dla IE6 i nimi to skorygować.
Go to the top of the page
+Quote Post

Posty w temacie
- maribt   Rozjeżdzanie się pod IE   7.04.2010, 00:29:39
- - AdIoS_Neo   Witam, po ss widzę, że chodzi o IE6 ? Na pocieszen...   7.04.2010, 03:18:52
- - maribt   tak, IE6;/ doszedłem już do tego, że odpowiedziln...   7.04.2010, 07:14:42
- - batman   W #menu img ustawiłeś margin. IE6 ma to do siebie,...   7.04.2010, 07:22:19
|- - maribt   Cytat(batman @ 7.04.2010, 08:22:19 ) ...   7.04.2010, 17:15:08
- - krzysztof_kf   No to daj dla selektora jak dajesz grafikę to po ...   7.04.2010, 17:23:27
|- - maribt   Cytat(krzysztof_kf @ 7.04.2010, 18:23...   7.04.2010, 19:06:15
- - batman   Wrzuć gdzieś stronę online. Łatwiej będzie znaleźć...   7.04.2010, 17:43:31
- - mortus   Do #hleft i #hright dodaj w css-ie overflow: hidde...   7.04.2010, 18:07:27
- - batman   No i się sprawa wyjaśniła. Dodaj do #menu overflow...   7.04.2010, 19:20:38
- - mortus   Opcjonalnie spróbuj ustawić display: inline-block;...   7.04.2010, 19:24:04
|- - maribt   Cytat(mortus @ 7.04.2010, 20:24:04 ) ...   7.04.2010, 20:50:22
- - krzysztof_kf   Wyrzuć z [CSS] pobierz, plaintext  .menu a ...   7.04.2010, 20:34:25
|- - mortus   Cytat(krzysztof_kf @ 7.04.2010, 21:34...   7.04.2010, 20:40:09
- - krzysztof_kf   Cytat(mortus @ 7.04.2010, 21:40:09 ) ...   7.04.2010, 20:46:34
- - batman   Cytat(maribt @ 7.04.2010, 21:50:22 ) ...   7.04.2010, 21:27:50
- - GreeN_DG   Z mojego punktu widzenia najlepszy : http://homep...   11.04.2010, 20:48:23

« Następny starszy · CSS · 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: 26.12.2025 - 03:29
Powered By IP.Board © 2025  IPS, Inc.
All changes by PHP.pl Administrators
Hosting zapewnia NQ.pl hosting, trac, svn