Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [HTML][CSS] Problem z internet explorer
Forum PHP.pl > Forum > Przedszkole
Fifi209
9.06.2009, 15:56:21
Mam problem z css (dla ie) dla ff,opery śmiga dobrze...

Strona na ie się rozjeżdża (obecnie tylko niektóre elementy, więcej nie umiałem zrobić...

KOD HTML: (przerobiony szablon)

[HTML] pobierz, plaintext 
  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
  2. <html xml:lang="en" xmlns="http://www.w3.org/1999/xhtml"><head>				
  3.  
  4. 			<title>Gimnazjum Nr 9 w Katowicach</title><meta http-equiv="content-type" content="text/html; charset=UTF-8"><script charset="utf-8" id="injection_graph_func" src="9gim_pliki/injection_graph_func.js"></script></head><body onload="load('news');"><div style="text-align: center; height: 110px;"><iframe src="9gim_pliki/reklama.htm" style="border: 0px none  ! important; display: block ! important; position: absolute; left: 50% ! important; top: 13px ! important; z-index: 10000 ! important; margin-left: -364px ! important; height: 90px ! important; width: 728px ! important;" scrolling="no" align="center" frameborder="0"></iframe></div>				
  5.  
  6. 				
  7.  
  8.  
  9.  
  10.  
  11.  
  12.   <script type="text/javascript" src="9gim_pliki/cookie.js"></script>
  13.   <script type="text/javascript" src="9gim_pliki/ajax.js"></script>
  14.    <script type="text/javascript" src="9gim_pliki/javascript.js"></script>
  15.  
  16.   <!-- **** layout stylesheet **** -->
  17.   <link rel="stylesheet" type="text/css" href="9gim_pliki/style.css">
  18.  
  19.   <!-- **** colour scheme stylesheet **** -->
  20.   <link rel="stylesheet" type="text/css" href="9gim_pliki/orange.css">
  21.   <noscript>
  22.   <META HTTP-EQUIV=Refresh CONTENT="0; URL=noscript.html">
  23.   </noscript>
  24.  
  25. <!--]>--><noscript onclick="''"></noscript><script type="text/javascript" src="9gim_pliki/reklama1.js"></script>
  26.   <div id="main">
  27.     <div id="links">
  28.       <!-- **** INSERT LINKS HERE **** -->
  29.       Style:  <a href="http://9gimnazjum.cba.pl/styl.php?name=blue">Niebieski</a> | <a href="http://9gimnazjum.cba.pl/styl.php?name=orange">Pomarańczowy</a> |
  30. 	  <a href="http://9gimnazjum.cba.pl/styl.php?name=green">Zielony</a> | <a href="http://9gimnazjum.cba.pl/styl.php?name=purple">Fioletowy</a>
  31.     </div>
  32.     <div id="logo"></div>
  33.     <div id="menu">
  34.       <ul>
  35.         <!-- **** INSERT NAVIGATION ITEMS HERE (use id="selected" to identify the page you're on **** -->
  36.         <li><a id="selected" href="#nowosci" onclick="load('news');">Strona główna</a></li>
  37. 		<li><a href="http://9gimnazjum.cba.pl/plan/">Plan Lekcji</a></li>
  38. 		<li><a href="#zast" onclick="load('zast');">Zastępstwa</a></li>
  39. 		<li><a href="http://www.9gimnazjum.1000lecie.pl/9gim/galeria.html">Galeria</a></li>
  40. 		<li><a href="#kontakt" onclick="load('kontakt');">Kontakt</a></li>
  41. 		<li><a href="#autorzy" onclick="load('autorzy');">Autorzy</a></li>
  42.       </ul>
  43.     </div>
  44.     <div id="content">
  45.       <div id="column1">
  46.         <div class="sidebaritem">
  47.           <div class="sbihead">
  48.             <h1>Menu:</h1>
  49.           </div>
  50.           <div class="sbilinks">
  51.             <!-- **** INSERT ADDITIONAL LINKS HERE **** -->
  52.             <ul>
  53. 				<li><a href="#docs" onclick="menu();">Dokumenty szkolne</a></li>
  54. 				<div id="menu2">
  55. 					<li><a href="#wso" onclick="download('wso');">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&gt;&gt; WSO</a></li>
  56. 					<li><a href="#system" onclick="download('system');">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&gt;&gt; Opis Systemu</a></li>
  57. 					<li><a href="#tabela" onclick="download('tabela');">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&gt;&gt; Tabela zachowań</a></li>
  58. 					<li><a href="#karta" onclick="download('karta');">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&gt;&gt; Karta zachowań</a></li>
  59. 				</div>
  60. 				<li><a href="#grono" onclick="load('grono');">Grono Pedagogiczne</a></li><li><a href="#plan" onclick="load('plan');">Plan Lekcji</a></li><li><a href="#zast" onclick="load('zast');">Zastępstwa</a></li><li><a href="#info" onclick="load('info');">Informacje dla Rodziców</a></li><li><a href="#samorzad" onclick="load('samorzad');">Samorząd uczniowski</a></li><li><a href="#sport" onclick="load('sport');">Sport w Szkole</a></li><li><a href="#rekrutacja" onclick="load('rekrutacja');">Rekrutacja</a></li><li><a href="#podreczniki" onclick="load('podreczniki');">Podręczniki</a></li><li><a href="#kontakt" onclick="load('kontakt');">Kontakt ze Szkołą</a></li><li><a href="#autorzy" onclick="load('autorzy');">Autorzy strony</a></li><li><a href="#absolwenci" onclick="load('absolwenci');">Absolwenci</a></li><li><a href="#mapa" onclick="load('mapa');">Mapa dojazdu</a></li><li><a href="#baza" onclick="load('baza');">Baza szkoły</a></li>
  61.             </ul>
  62.           </div>
  63.         </div>
  64.         <div class="sidebaritem">
  65.           <div class="sbihead">
  66.             <h1>Dla uczniów:</h1>
  67.           </div>
  68.           <div class="sbilinks">
  69.             <!-- **** INSERT ADDITIONAL LINKS HERE **** -->
  70.             <ul>
  71. 				<li><a target="test" href="http://sciaga.pl/">Ściąga.pl</a></li>
  72. 				<li><a target="_blank" href="http://poolicz.pl/">Poolicz.pl</a></li>
  73. 				<li><a target="_blank" href="http://pl.wikipedia.org/wiki/">Wikipedia.org</a></li>
  74. 				<li><a target="_blank" href="http://open.fm/">Open.fm</a></li>
  75. 				<li><a target="_blank" href="http://nasza-klasa.pl/">Nasza-klasa.pl</a></li>
  76.             </ul>
  77.           </div>
  78.         </div>
  79.       </div>
  80.       <div id="column2"><!--]>--><noscript onclick="''"></noscript><script type="text/javascript" src="9gim_pliki/reklama1.js"></script>				
  81. 				<h1>Nowa Strona</h1><p>A więc po kilkunastu dniach pracy, powstała nowa strona szkoły. Miłego dnia!</p><p id="author">Napisał: Fast w dniu: 07-03-2009 o godzinie: 09:19:50</p><script type="text/javascript"></script><div style="text-align: center; font-size: 11px;" class="cbalink"><a href="http://www.cba.pl/" title="darmowy hosting">Darmowy Hosting</a> CBA.PL<br><br></div>
  82. <!--]>--><noscript onclick="''"></noscript><script type="text/javascript" src="9gim_pliki/reklama2.js"></script>
  83. <script src="9gim_pliki/urchin.js" type="text/javascript"></script>
  84. <script type="text/javascript">
  85. _uacct = "UA-2289508-3";
  86. urchinTracker();
  87. </script>
  88.  
  89. </div>
  90. 	</div>
  91.     <div id="footer">
  92. 	 copyright Š 2006 xxx | Odwiedzin: 158
  93. 	</div>
  94.   </div>
  95. <script type="text/javascript"></script><div style="text-align: center; font-size: 11px;" class="cbalink"><a href="http://www.cba.pl/" title="darmowy hosting">Darmowy Hosting</a> CBA.PL<br><br></div>
  96. <!--]>--><noscript onclick="''"></noscript><script type="text/javascript" src="9gim_pliki/reklama2.js"></script>
  97. <script src="9gim_pliki/urchin.js" type="text/javascript"></script>
  98. <script type="text/javascript">
  99. _uacct = "UA-2289508-3";
  100. urchinTracker();
  101. </script>
  102.  
  103. </body><div FirebugVersion="1.3.3" style="display: none;" id="_firebugConsole"></div></html>
[HTML] pobierz, plaintext


Css niżej.

CODE

/* global */
html{height: 100%;}

body
{ font-family: verdana, arial, sans-serif;
padding: 0px;
margin: 0px;
font-size: .68em;
}

p
{ margin: 0px;
padding: 0px 0px 16px 0px;
line-height: 1.7em;
}

h1
{ font-family: arial, sans-serif;
letter-spacing: .1em;
}

h2
{ margin: 0px;
padding: 0px 0px 4px 0px;
font-size: 100%;
}

img{border: 0px;}

a{outline: none;}

/* image positioning - left, right and center */
.left
{ float: left;
padding: 0px 8px 0px 0px;
}

.right
{ float: right;
padding: 0px 0px 0px 8px;
}

.center
{ display: block;
text-align: center;
margin: 0 auto;
}

/* block quote */
blockquote
{ margin: 20px 0px 20px 0px;
padding: 10px 20px 0px 20px;
border-left: 8px solid;
}

/* unordered list */
ul
{ margin: 8px 0px 0px 16px;
padding: 0px;
}

ul li
{ list-style-type: square;
margin: 0px 0px 11px 0px;
padding: 0px;
}

/* ordered list */
ol
{ margin: 8px 0px 0px 24px;
padding: 0px;
}

ol li
{ margin: 0px 0px 11px 0px;
padding: 0px;
}

/* margin lefts / margin rights - to centre content */
#main, #links, #footer, #logo, #menu, #content
{ margin-left: auto;
margin-right: auto;
}

/* main container */
#main{width: 780px;}

/* links above the logo / footer */
#links, #footer
{ padding: 10px 21px 0px 19px;
width: 720px;
height: 26px;
font-size: 94%;
text-transform: uppercase;
}

#links{text-align: right;}

#footer{text-align: center;}

#links a, #footer a{text-decoration: none;}

#links a:hover, #footer a:hover{text-decoration: underline;}

/* logo */
#logo
{ width: 760px;
height: 100px;
text-align: left;
}

#logo h1
{ margin: 0px;
padding: 41px 0px 0px 19px;
font-size: 150%;
letter-spacing: .2em;
}

/* navigation menu */
#menu
{ height: 42px;
width: 760px;
}

#menu ul{margin: 0px auto;}

#menu li
{ float: left;
margin: 0px;
padding: 0px;
list-style: none;
}

#menu li a
{ display: block;
float: left;
height: 37px;
text-decoration: none;
padding: 3px 19px 2px 19px;
text-transform: uppercase;
}

/* main content */
#content
{ width: 760px;
height: auto;
padding: 0px;
overflow: hidden;
}

/* column 1 - contains sidebar items */
#column1
{ width: 207px;
float: right;
padding: 16px 0px 15px 0px;
}

.sidebaritem
{ text-align: left;
width: 188px;
float: left;
margin: 0px 0px 25px 0px;
}

.sbihead
{ height: 14px;
width: 188px;
padding: 5px 0px 5px 19px;
text-transform: uppercase;
}

.sbihead h1
{ padding: 0px;
margin: 0px;
font-weight: bold;
font-size: 112%;
}

.sbicontent{padding: 14px 8px 8px 19px;}

.sbicontent p
{ line-height: 14px;
padding: 0px 0px 8px 0px;
}

.sbilinks{padding: 0px;}

.sbilinks ul{margin: 0px auto;}

.sbilinks li
{ margin: 0px;
float: left;
list-style: none;
}

.sbilinks li a , .sbilinks li a:hover
{ float: left;
height: 16px;
text-decoration: none;
padding: 5px 0px 4px 19px;
width: 188px;
border: 0px;
}

/* column 2 - page content */
#column2
{ text-align: justify;
width: 512px;
float: left;
padding: 12px 3px 15px 19px;
}

#column2 h1
{ padding: 6px 0px 4px 0px;
margin: 0px 0px 12px 0px;
border-bottom: 1px solid;
font-size: 150%;
text-transform: uppercase;
font-weight: normal;
}

.sidebaritem a, #column2 a, .sidebaritem a:hover, #column2 a:hover
{ padding: 0px;
text-decoration: none;
padding-bottom: 2px;
border-bottom: 1px dashed;
}

.sidebaritem a:hover, #column2 a:hover{border-bottom: 1px solid;}

/* additional colour scheme selections */
#colour{margin: 0px 0px 20px 0px;}

#colour a, #colour a:hover{border: 0px;}

.blue
{ background: #FFFFFF url(blue.png) no-repeat left center;
color: #109CEF;
padding: 0px 40px 0px 20px;
}

.green
{ background: #FFFFFF url(green.png) no-repeat left center;
color: #94C65A;
padding: 0px 40px 0px 20px;
}

.purple
{ background: #FFFFFF url(purple.png) no-repeat left center;
color: #CE5AEF;
padding: 0px 40px 0px 20px;
}

.orange
{ background: #FFFFFF url(orange.png) no-repeat left center;
color: #FF9C21;
padding: 0px 40px 0px 20px;
}

#menu2 {
background: #FFFFFF;
display: none;
list-style: none;
font-size: 9px;
}


i

CODE

body
{ background: #636363;
color: #70695A;
}

blockquote{border-color: #767676;}

#main
{ background: #FFF url(main.png) repeat-y;
color: #70695A;
}

#links, #footer, #menu, #menu li a
{ background: #FFF url(menu.png);
color: #DBD7D1;
border-color: #D7D7D7;
}

#links a, #footer a, #links a:hover, #footer a:hover
{ background: transparent;
color: #DBD7D1;
}

#logo
{ background: #FFF url(logo.png) no-repeat;
color: #70695A;
}

h1
{ background: transparent;
color: #EA8916;
border-color: #CAAE90;
}

#menu li a:hover, #menu li a#selected, #menu li a#selected:hover
{ background: #FFF url(orange_menu.png);
color: #70695A;
}

#content, #column2 a, #column2 a:hover
{ background: transparent;
color: #70695A;
}

.sidebaritem, .sidebaritem a, .sidebaritem a:hover
{ background: transparent;
color: #DBD7D1;
}

.sbihead
{ background: #FFF url(orange_sbi.png);
color: #70695A;
}

.sbihead h1
{ background: transparent;
color: #70695A;
}

.sbilinks li a
{ background: #FFF url(link.png);
color: #DBD7D1;
}

.sbilinks li a:hover
{ background: #B7B7B7;
color: #EA8916;
}
erix
9.06.2009, 19:09:59
Cytat
Strona na ie się rozjeżdża (obecnie tylko niektóre elementy, więcej nie umiałem zrobić...

Może byś dał to gdzieś "na żywo", a nie będziemy sobie interpretować CSS z osobna?

Ale w ciemno: zrób osobny CSS i zdefiniuj od nowa marginesy.
Fifi209
9.06.2009, 19:58:38
Internet Explorer:
Firefox:

Co do css nie mam zbytnio pojęcia o tym ;<
kamil4u
9.06.2009, 20:16:12
Poczytaj o box-model, a dowiesz się, że IE ma to zrobione inaczej niż w standardach W3C. I tak jak Ci już radzono, zrób style tylko dla IE poprawiając to(komentarze warunkowe)
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.