[CSS] IE źle wyświetla Opcje

[kaznodzieja]

Witam!

Proszę o pomoc z poprawieniu arkusza CSS dla IE. Stronę http://magistra.pl/ testuje po Operą 10 i FF 3.5 i wszystko jest w porządku, natomiast jak zwykle IE coś nie pasuje. Stworzyłem oddzielny css dla IE ale pomimo kilku godzin prób ciągle nie uzyskałem efektu jaki widać w Operze i FF.

[XML] pobierz, plaintext 
body { 
	background : #f5fbfc none repeat scroll 0% 0%; 
	background-attachment : fixed; 
	color : #666666; 
	font-family : Verdana, Geneva, Arial, Helvetica, sans-serif; 
	font-size : 11px; 
} 
a, a:visited { 
	color : #0055ff; 
	text-decoration : none; 
} 
a:hover, a:active { 
	color : #ff6600; 
	text-decoration : none; 
} 
a img { 
	border : 0; 
} 
.ttt { 
	color : #666666; 
} 
#recomended { 
	background : #ffffff none repeat scroll 0% 0%; 
	border : 1px solid #c0d0e0; 
	margin-bottom : 20px; 
	margin-left : 10px; 
	padding : 10px; 
} 
#recomended h3 { 
	background : transparent url(grafika/box_title_bg.gif) no-repeat scroll left 	top; 
	color : #d8790e; 
	display : inline; 
	float : left; 
	font-size : 13px; 
	font-weight : bold; 
	height : 20px; 
	margin-top : -10px; 
	padding : 1px 0 0 0; 
	position : relative; 
	text-align : center; 
	width : 190px; 
	border : 0 none; 
	clear : right; 
	line-height : normal; 
	margin : 0; 
	right : -1px; 
	top : -1.6em; 
} 
#recomended p { 
	font-size : 11px; 
} 
#recomended2 { 
	background : #ffffff none repeat scroll 0% 0%; 
	border : 1px solid #c0d0e0; 
	margin-bottom : 20px; 
	margin-left : 10px; 
	padding : 10px; 
} 
#recomended2 h3 { 
	background : transparent url(grafika/box_title_bg.gif) no-repeat scroll left 	top; 
	color : #d8790e; 
	display : inline; 
	float : left; 
	font-size : 13px; 
	font-weight : bold; 
	height : 20px; 
	margin-top : -10px; 
	padding : 1px 0 0 0; 
	position : relative; 
	text-align : center; 
	width : 190px; 
	border : 0 none; 
	clear : right; 
	line-height : normal; 
	margin : 0; 
	right : -1px; 
	top : -1.6em; 
} 
#recomended2 p { 
	font-size : 11px; 
} 
#cialo { 
	background-color : #ffffff; 
	width : 87%; 
	height : 100%; 
	display : table; 
} 
#naglowek { 
	background : #f5fbfc url(grafika/logo.jpg) no-repeat scroll center top; 
	height : 132px; 
	width : 80%; 
	display : table-row; 
} 
#naglowek h1, h2, h3 { 
	font-family : Georgia, "Times New Roman", Times, serif; 
	font-weight : normal; 
	color : #ffffff; 
} 
#naglowek h1 { 
	padding : 10px 0 0 50px; 
	letter-spacing : -1px; 
	font-size : 2.6em; 
} 
#naglowek h2 { 
	margin : -5px 0 0 50px; 
	font-size : 1.8em; 
} 
#srodek { 
	background : #f5fbfc none repeat scroll 0% 0%; 
	display : table-row; 
	height : 100%; 
	width : 100%; 
	top : 20px; 
	text-align : left; 
} 
#menu { 
	display : table-cell; 
	height : 100%; 
	float : left; 
	text-align : left; 
	vertical-align : top; 
	margin : 10px; 
	padding : 10px; 
} 
#menu2 { 
	background : #f5fbfc none repeat scroll 0% 0%; 
	display : table-cell; 
	height : 100%; 
	float : right; 
	text-align : left; 
	vertical-align : top; 
	margin : 10px; 
	padding : 10px; 
} 
#strona { 
	background : #f5fbfc none repeat scroll 0% 0%; 
	display : table-cell; 
	font-size : 12px; 
	vertical-align : top; 
	padding : 5px 5px 15px 5px; 
	text-align : left; 
	margin : 20px; 
} 
div.stopka { 
	background : #f5fbfc none repeat scroll 0% 0%; 
	display : table-row; 
	vertical-align : middle; 
	height : 20px; 
	width : 100%; 
	text-align : center; 
	font-size : smaller; 
	border : 1px solid #000000; 
} 
.navigacja h1 { 
	display : block; 
	background-image : url("grafika/menu.jpg"); 
	background-repeat : repeat-x; 
	font-size : 12px; 
	color : #ffffff; 
	font-weight : bold; 
	width : 150px; 
	height : 25px; 
	padding : 5px 0 5px 5px; 
	border : 0 solid #ccc; 
	left : 10px; 
} 
.navigacja2 { 
	background : #ffffff none repeat scroll 0% 0%; 
	border : 1px solid #c0d0e0; 
	margin-bottom : 20px; 
	margin-left : 10px; 
	padding : 10px; 
	width : 190px; 
} 
.navigacja2 h3 { 
	background : transparent url(grafika/box_title_bg.gif) no-repeat scroll left 	top; 
	color : #d8790e; 
	display : inline; 
	float : left; 
	font-size : 13px; 
	font-weight : bold; 
	height : 20px; 
	margin-top : -10px; 
	padding : 1px 0 0 0; 
	position : relative; 
	text-align : center; 
	width : 190px; 
	border : 0 none; 
	clear : right; 
	line-height : normal; 
	margin : 0; 
	right : -1px; 
	top : -1.6em; 
} 
.navigacja3 { 
	background : #ffffff none repeat scroll 0% 0%; 
	border : 1px solid #c0d0e0; 
	margin-bottom : 20px; 
	margin-left : 10px; 
	padding : 10px; 
	width : 190px; 
} 
.navigacja3 h3 { 
	background : transparent url(grafika/box_title_bg.gif) no-repeat scroll left top; 
	color : #d8790e; 
	display : inline; 
	float : left; 
	font-size : 13px; 
	font-weight : bold; 
	height : 20px; 
	margin-top : -10px; 
	padding : 1px 0 0 0; 
	position : relative; 
	text-align : center; 
	width : 190px; 
	border : 0 none; 
	clear : right; 
	line-height : normal; 
	margin : 0; 
	right : -1px; 
	top : -1.6em; 
} 
.obrazek { 
	float : left; 
	margin : 5px 5px 5px 5px; 
	padding : 3px 3px 3px 3px; 
	border : 1px solid #c0d0e0; 
} 
.trnaglowek { 
	border-collapse : 1px collapse; 
	text-align : center; 
}  
table.center { 
	margin-left : auto; 
	margin-right : auto; 
} 
.naglowektable { 
	background-image : url('grafika/menu_strip_bg.jpg'); 
	text-align : center; 
	font-weight : bold; 
} 
.parzysty { 
	background : #f5fbfc; 
	text-align : center; 
} 
.nieparzysty { 
	text-align : center; 
} 
.male { 
	font-size : 9px; 
} 
h4 { 
	text-align : center; 
} 
 
[XML] pobierz, plaintext 

[krzysztof_kf]

hmm pod ie 7 jest okej jeżeli chodzi pod starszą wersję ie bym sprawę bagatelizował bo starą przeglądarkę nikt nie używa (IMG:style_emoticons/default/exclamation.gif) ! nie ma sensu ...

[Gryf]

@krzysztof_kf dziwne u mnie na ie tester pod ie 7 to wygląda tak!
co do problemu to aby coś poukładać przy pomocy float pierw należy określić szerokość obiektu!
poza tym jak to jest do #menu2 dajesz float ale do #strona już nie?

Ten post edytował Gryf 14.02.2010, 20:56:50

[kaznodzieja]

Przyznam się szczerze że CSS to moja dobra. Gryf  u mnie wygląda tak samo jak u Ciebie. Może mi dokładnie powiedzieć co gdzie zmienić, i co to za tester IE jest?

[krzysztof_kf]

@krzysztof_kf dziwne u mnie na ie tester pod ie 7 to wygląda tak!
co do problemu to aby coś poukładać przy pomocy float pierw należy określić szerokość obiektu!
poza tym jak to jest do #menu2 dajesz float ale do #strona już nie?

eee ? może wyczyść cookie bo u mnie jest ok ;/ podaj jaką przeglądarka ie masz wersja stara czy nowa po pod nową jest wszystko OK (IMG:style_emoticons/default/exclamation.gif) !niedawno co formatowałem kompa ;/

Ten post edytował krzysztof_kf 14.02.2010, 21:04:59

[Gryf]

ieTester aplikacja pozwalająca zobaczyć stronę pod różnymi wersjami ie ;] Link!
już ci prędzej pisałem nadaj szerokości - width dla elementów o ID - #menu2 oraz #strona
mogą to być px lub % oraz do #strona dodaj float'a do lewej ;]
ja bym jeszcze wywalił tą namiastkę tabelek -> display : table-cell; <- nie wiem po co to dali do specyfikacji xP

add..
@krzysztof_kf jeśli chodzi o ie8 to tak wszystko jest OK! ale pod testerem szaleje! i analizując kod powinno szaleć ;]

Ten post edytował Gryf 14.02.2010, 21:08:10

[krzysztof_kf]

chyba się nie dogadamy panie autorze pod jaką wersję ie źle wyświetla (IMG:style_emoticons/default/questionmark.gif) ?

(IMG:http://img502.imageshack.us/img502/9812/catsew.jpg)

[kaznodzieja]

Gryf Dodałem width i float oraz wywaliłem wszystkie display A menu boczne nie chce się podnieść do góry 




krzysztof_kf Używam IE 7

[krzysztof_kf]

napierw daj jakąś szerokość dla

Kod

#strona {
  width:
  float: left;

dodaj do klasy

Kod

.navigacja 2 {
   float: left;

ja rozumiem a dla żadnej klasy itp nie podałeś szerokości

// moment zobacze po przez testera

Ten post edytował krzysztof_kf 14.02.2010, 21:46:42

[kaznodzieja]

nie pomogło Rozumiem że ty używasz IE 8

[krzysztof_kf]

co to jest ?

Kod

.navigacja2 a, a:visited {
/*  right : 10px; ok

[kaznodzieja]

to jest śmieć Całe style .navigacja2 a, a:visited są zakomentowane. Dodatkowo to są style dla innych przeglądarek nie IE. Style dla IE są w pliku style-ie.css

[krzysztof_kf]

dodaj do pliku css ie

Kod

}
#strona {
        width: 760px;
        float: left;
}

[kaznodzieja]

miałem wpisane 70% i zmieniłem na 69% Dzięki za ostatnią podpowiedz i pomoc

[krzysztof_kf]

nie ma problemu dalej nie wnikałem jest ok aczkolwiek prawa strona nie ma chyba marginesu ze względu inne położenie niż lewa strona

[060156]

Sprobuj dodac na koncu,moze pomoze
<div style="clear:both"></div>