firefox a explorer

matysiak · Post autor: **matysiak** » wt lip 10, 2007 5:45 pm

witam;) mam maly problem mam mniej wiecej zrobiona stronke lecz niestety firefox mi tego nie czyta jak powinno natomiat explorere tak

zrobilby mi ktos poprawki w kodzie?
oto moja stronka
www.matysiak.yoyo.pl

ooo_michal · Post autor: **ooo_michal** » wt lip 10, 2007 6:47 pm

Wrzuć jakiegoś screena jak to ma wyglądać bo mi się właśnie w IE nie widzi. Jak ci pasuje to pisz na maila bo częściej pocztę sprawdzam niż siedzę na forum [email protected].

sztacho · Post autor: **sztacho** » wt lip 10, 2007 8:50 pm

Pamiętaj, to IE źle interpretuje kod strony. Dlatego pisz go pod inne przeglądarki. Ucz się dobrego kodu, a dla IE wprowadzaj poprawki

Długo by gadać...

matysiak · Post autor: **matysiak** » śr lip 11, 2007 7:14 am

a zrobiłby mi ktos poprawke w kodzie pod firefoxa?

b2s20 · Post autor: **b2s20** » ndz sty 27, 2008 1:14 pm

Mój problem wygląda następująco:
W FireFox wszystko wygląda tak jak powinno czyli tekst jest równocześnie z grafiką po lewej stronie:

a w IE tekst zjeżdża w dół czyli najpierw są obrazki a pod obrazkami tekst:/

oto kod css:

[xml]body {
background-color: #f2f2f0;
margin: 0;
padding: 0;
text-align:center;
}

div {
font: verdana 12px #000;
position:relative;
}
a {
text-decoration: none;
}
#container {
background: url(images/background.jpg);
margin:0 auto;
padding:0 0px 0 0px;
position:relative;
width:1000px;
height:100%;
text-align:left;
clear: both;
background-color:#FFFFFF;
}

#naglowek {
background: #fff url(images/logo.jpg) no-repeat;
width:1000px;
height:181px;
margin-bottom:0px;
}
#menu {
background: #fff url(images/pasek.jpg) no-repeat;
width:auto;
height:33px;
margin-bottom:0px;
margin-top:-16px;
}
#menu ul {
list-style: none;
}
#menu li {
float: left;
padding-left:50px;
padding-top:5px;
font-weight: bold;
font-size: 14px;
}
#menu a {
display: block;
line-height: 20px;
padding: 0 8px;
color: #fff;
font-weight: bold;
}
#menu a:hover {
background: #fff;
color: #294b9d;

}
#lewy {
background: #fff
width:160px;
height:100%;
float:left;
padding-left:0px;
margin-left:28px;
}
#lewy dl {
margin: 0px;
}
#lewy dt {
font-size: 12px;
color: #000;
background:url(images/menu.jpg) no-repeat;
font-weight: bold;
height:20px;
width:157px;
padding-top:6px;
text-align:center;
}
#lewy dd {
font-size:13px;
margin-top:3px;
margin-left:6px;
}
#lewy a {
font-size:14px;
color: #000000;
line-height: 150%;
}
#lewy a:hover {
text-decoration:underline;
}
#bottom {
background:
width:160px;
height:8px;
margin-top:20px;
}
#srodek {
background: #fff
width:400px;
height:auto;
float:left;
margin-left:50px;
margin-top:3px;
margin-bottom:40px;
}
#srodek a {
color:#000000;
text-decoration:underline;
}
#srodek h2 {
padding-top:15px;
background-color:#FFFFFF;
font-size: 15px;
color: #294b9d;
line-height: 150%;
padding-left:15px;
margin-top:0px;
}
#srodek p {
margin-bottom:8px;
text-indent: 15px;
text-align: justify;
padding-left:15px;
padding-right:5px;
padding-top:0px;
padding-bottom:4px;
font-size:12px;
font-family:Verdana, Arial, Helvetica, sans-serif;
}
#tlo2 {
background: url(images/tlo_2.jpg) repeat;
float:right;
width:27px;
height:400px;
}
#stopka {
background: #f2f2f0 url(images/stopka.jpg) no-repeat;
clear:both;
font-size:11px;
font-family:Verdana, Arial, Helvetica, sans-serif;
height:28px;
color:#FFFFFF;
padding-top:8px;
padding-right:30px;
}
#stopka a {
color: #FFFFFF;
}
#stopka a:hover {
text-decoration:underline;
}
#copyright {
float:left;
padding-left:300px;
}
#design {
float:left;
margin-left:50px;
}[/xml]
a tutaj html :

[xml]<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<meta name="generator" content="WebSite PRO 4.3" />
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-2" />
<meta http-equiv="Content-Language" content="pl" />
<meta name="Keywords" content="klimatyzacja, wentylacja, chłodnitwo, montaż, projektowanie, naprawa" />
<meta name="Description" content="......................Myszków" />
<meta name="Robots" content="ALL" />
<meta name="Author" content="Marcin Polak" />
<link rel="stylesheet" href="style.css" type="text/css" />
<title>"............................." Klimatyzacja, wentylacja, chłownictwo</title>
</head>

<body>
<div id="container">

<div id="naglowek"></div>

<div id="menu">
<ul>
....................................................................................
</ul>
</div>

<div id="lewy">
<br>
<dl>
<dt>Współpraca:</dt>
<br>
<br>
<br>

</dl>
<div id="bottom"></div>
</div>

<div id="srodek">
<br>
<br>
<br>
<h1>Witamy na stronie <br>
firmy "........................................." Myszków.</h1><br>

<h2>Z przyjemnością chcielibyśmy zaprezentować Państwu naszą ofertę związaną<br>
z usługami klimatyzacji, wentylacji oraz chłodnictwa. Jesteśmy firmą działającą<br>
na terenie Polski połódniowej. Oferowana przez nas klimatyzacja i wentylacja<br>
charakteryzuje się wysoką i sprawdzoną niezawodnością. Mamy za sobą lata<br>
doświadczeń, które procentują przy każdym powierzanym nam projekcie.<br>
Naszą domeną jest sumienność, pracowitość, terminowość, co potwierdzają liczne<br>
listy referencyjne. Zespół tworzący firmę ....................................... składa się z <br>
wykwalifikowanych pracowników, dla których praca to przyjemność, co przekłada <br>
się na jakość wykonywanej pracy.Powierzone nam zadania są wykonywane z <br>
największą dokładnością przez naszych pracowników. Pragniemy, aby logo firmy <br>
oraz jego barwy kojarzyły się z porządkiem, bezawaryjnością oraz <br>
wysokim poziomem wykonywanych usług.</h2>

</div>

<div id="stopka">
<div id="copyright">Copyright by Marcin Polak</div>
<div id="design">Design by...........................................</div>
</div>

</div>
</body>
</html>[/xml]

BARDZO PROSZĘ O POMOC

kulmen · Post autor: **kulmen** » wt sty 29, 2008 9:28 pm

IE źle interpretuje box model. Musisz pokombinować z marginesami i paddingami. M.in. IE podwaja margines dla floatowanych elementów czyli piszesz margin-left: 50px a IE daje Ci 100px. Rozwiązanie: hack CSS czytany tylko przez IE np: * HTML styl {....}, usunięcie marginesów i dodanie dodatkowych wewnętrznych div'ów z tymi marginesami, expressions, osobne pliki stylów dla IE i FF wywoływane z poziomu PHP i... pewnie jeszcze coś się da wymyślić. Do wyboru, do koloru

HERO · Post autor: **HERO** » pn lut 11, 2008 4:10 pm

nie kombinuj z jednym css'em dla IE ff i opery
mniej czasu Ci zajmie

Kod: Zaznacz cały

<!--[if lte IE 6]>
<link rel="stylesheet" type="text/css" href="iehacks.css" />
<![endif]-->
<!--[if IE 7]>
<link rel="stylesheet" type="text/css" href="ie7hacks.css" />
<![endif]-->

MobyDick · Post autor: **MobyDick** » wt lut 26, 2008 6:34 pm

Czasami odnoszę wrażenie ze kolejne wersje IE powstają po to żeby webmasterom było trudniej, co chwile słychać ze pod IE wszystko sie rozjeżdża, źle sie wyświetla, masakra.
Cale szczęście, że popularność IE maleje.

htmlowiecii · Post autor: **htmlowiecii** » wt sty 06, 2009 7:52 pm

może napiszmy jako społeczność webmasterów do M$ list aby albo zaniechali dalszego rozwoju IE albo zrobili go kompatybilnym ze standardami internetowymi???

ooo_michal · Post autor: **ooo_michal** » wt sty 06, 2009 8:08 pm

Raczej do tych którzy korzystają z IE6 zeby zaczeli instalowac aktualizacje

htmlowiecii · Post autor: **htmlowiecii** » pt sty 16, 2009 1:12 pm

też fakt to może napiszmy 2 listy

kylof · Post autor: **kylof** » ndz sty 25, 2009 12:14 am

ja mam podobny problem. Czcionki w IE są dużo większe niż w Mozilli czy Operze. Jakby tego było mało to jeszcze zanika tabelka stanowiąca tło pod newsy. Zostaje tylko warstwa najniższa czyli samo tło strona do obejrzenia tutaj może ktoś coś poradzi www.lso-zabno.pl

Regulus · Post autor: **Regulus** » wt lut 10, 2009 2:13 pm

Kolejny problem:

kod:CSS

Kod: Zaznacz cały


#menu {
   width: 160px;
   margin-left: 180px;
   } 

#menu li a {
	height: 31px;
  	voice-family: ""}""; 
  	voice-family: inherit;
  	height: 31px;
	text-decoration: none;
	font-family: Tahoma;
	font-size:15px;
	font-weight: 700;
	overflow: hidden;
	}	
	
#menu li a:link, #menu li a:visited {
	color: #468B34;
	display: block;
	padding: 0px 0 0 10px;
        background:  url(przycisk-a-sepia.jpg);
	border-bottom: 1px solid #D3CABD;
	}
	
#menu li a:hover {
	color: #468B34;
	padding: 0px 0 0 10px;
        background:  url(przycisk-a1.jpg);
	border-right: 1px solid #468B34;

Kod: HTML:

Kod: Zaznacz cały

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"/>
<head>
<META HTTP-EQUIV="Content-type" CONTENT="text/html; charset=iso-8859-2"/>
<META NAME="Keywords" CONTENT=""/>
<META NAME="Description" CONTENT=""/>
<META NAME="Robots" CONTENT="ALL, INDEX"/>
<link rel="stylesheet" type="text/css" href="webstylcss.css"/>
<title>Webstyl</title>
<!--[if lte IE 6]>
<link rel="stylesheet" type="text/css" href="iehacks.css" />
<![endif]-->
<!--[if IE 7]>
<link rel="stylesheet" type="text/css" href="ie7hacks.css" />
<![endif]-->

</head>

<body>
<div id="banner">
	<div id="menu">
		<ul>
			<li><A HREF="#" TARGET="_self">link1</A></li>
			<li><A HREF="#" TARGET="_self">link2</A></li>
			<li><A HREF="#" TARGET="_self">link3</A></li>
			<li><A HREF="#" TARGET="_self">link4</A></li>
			<li><A HREF="#" TARGET="_self">link5</A></li>
		</ul>	
	</div>
</div>
	<div class="listwa"></div>
		<div id="glownatlo">
			<div id="lewa">
				<div id="tyt1">O nas
				</div>
				<div id="adres">
				<p>
				Kontakt:<br/>
				<A HREF="#">Eltanianin(at)o2.pl</A>
				</p>
				</div>
			</div>
			<div id="prawa">
				<div id="pasekgora-p">
				</div>
					<div id="tresc">
			tresc tresc tresc 
				</div>
			<div id="pasekdol-p">
		</div>	
	</div>
</div>
<div class="listwa"></div>	
<div id="stopka"></div>
</body>
</html>

Zastosowałem, jak widać tę wskazówkę od HERO, (rozumiem że ma to być wstawione do dokumentu HTML w sekcji <head>).

odrębny CSS dla pier*&^..IE6
CSS:

Kod: Zaznacz cały

#menu {
	width: 160px;
	margin-left: 180px;
	}
	
#menu li a {
	height: 30px;
  	voice-family: ""}""; 
  	voice-family: inherit;
  	height: 30px;
	text-decoration: none;
	font-family: Tahoma;
	font-size:15px;
	font-weight: 700;
	overflow: hidden;
	}	
	
#menu li a:link, #menu li a:visited {
	color: #468B34;
	display: block;
	padding: 0px 0 0 10px;
	border-bottom: 1px solid #D3CABD;
	}
	
#menu li a:hover {
	color: #468B34;
	padding: 0px 0 0 10px;
	border-right: 1px solid #468B34;

Rozumiem że powinna być inna interpretacja weight: w IE6 niż w pozostałych i background: nie powinien być widoczny w IE6.
Jednak w IE6 widać nadal obrazek tła.

Jakby tego było mało, że IE6 widzi, to czego nie ma widzieć, to jeszcze robi niepożądane przerwy pomiędzy obrazkami tła umieszczonymi w
#menu li a {} oraz w
#menu li a:hover {}
Ratunku!!!!

Jeszce jedno; czy zastosowanie takiego zapisu:
CSS

Kod: Zaznacz cały

div {
padding:10px 0 0 0 !important; /*moz padding*/
padding:5px 0 0 0; /*IE padding*
}

nie będzie się dla odmiany kłócić z IE7?

offtopic:

htmlowiecii pisze:też fakt to może napiszmy 2 listy

Tak i niech to puszczą w telewizji "Trwam", albo jakimś innym TVN

R.

ps. Coraz bardziej skłaniam się do olania tych13,5% użytkowników IE6, mniejszość powinna dostosować się do standardu większości, tak jak w każdej demokracji :>

ooo_michal · Post autor: **ooo_michal** » wt lut 10, 2009 6:48 pm

Jedna uwaga. To nie jest odrębny CSS dla IE tylko dodatkowy. W związku z tym twój główny CSS jest ładowany także w IE.

Regulus · Post autor: **Regulus** » wt lut 10, 2009 8:50 pm

ooo_michal pisze:Jedna uwaga. To nie jest odrębny CSS dla IE tylko dodatkowy. W związku z tym twój główny CSS jest ładowany także w IE.

Dobra, ok, w z związku z tym i powyższym co napisałem, jak obejść problem?

R.

firefox a explorer

firefox a explorer

Re: firefox a explorer

Re: firefox a explorer

Re: firefox a explorer

Re: firefox a explorer

Re: firefox a explorer

Re: firefox a explorer

Re: firefox a explorer

Re: firefox a explorer

Re: firefox a explorer

Re: firefox a explorer

Re: firefox a explorer

Re: firefox a explorer

Re: firefox a explorer

Re: firefox a explorer