Werkt niet in Firefox

Status
Niet open voor verdere reacties.
M

Maaarten

Gebruiker
Lid geworden
27 aug 2009
Berichten
52
Hallo weet iemand hoe het komt dat dit niet werkt in firefox en wel in IE?
HTML: 
h2 {
	width:200px; 
	font: bold 11px "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
	color: #4f6b72;
	border-right: 1px solid #C1DAD7;
	border-bottom: 1px solid #C1DAD7;
	border-top: 1px solid #C1DAD7;
	letter-spacing: 2px;
	text-transform: uppercase;
	text-align: left;
	padding: 6px 6px 6px 12px;
	background: #CAE8EA url(images/bg_header.jpg) no-repeat;
}

HTML: 
<h2> Overzicht Facturatie</h2>
 
Hoi Maarten,
Als ik dit inplak in een verder kale pagina (wel met een DOCtype "strict" en een utf-8 charset), ziet het er gewoon hetzelfde uit in IE7 en FF3. :shocked:
Wat werkt er bij jou niet in FF?

Met vriendelijke groet,
CSShunter
 
Wel normaal moet er bij een H2 een image achtergrond staan. Bij IE doet hij het maar bij firefox doet hij dat niet.
 
Bij mij staat in Firefox ook keurig 'n achtergrond-afbeelding in de <h2>
 
Snap niets van ... zie ook geen verschil FF/IE.
Vragen, vragen!
  • Is het bovenstaande de echte code van de pagina (met css in een styleblok in de <head>), of zit er een apart stylesheet in? Dan zou er misschien iets mis kunnen zijn met de link naar het stylesheet.
  • En is het verschijnsel bij jou alleen bij lokale bezichtiging, en/of bij bekijken van de pagina als deze op de server staat?
  • Is wat er verder aan css (boven) staat, valid css?
  • En is de pagina valid html?
Geef anders even een link, zodat we het met eigen ogen kunnen zien. Dan valt er meer over te zeggen dan nu. :)

Met vriendelijke groet,
CSShunter

PS
Iemand heeft toch niet per ongeluk in de FF-opties het vinkje bij "Inhoud > Afbeeldingen automatisch laden" weggehaald? ;)
 
En de css-validator op http://jigsaw.w3.org/css-validator/
Er mist 'n } in je css (en mogelijk nog meer fouten, maar dat kan de validator niet zien zo). 't Kan best dat Firefox daarom de rest, waaronder de h2, gewoon negeert.
Als ik je link volg, kom ik trouwens op 'n pagina waar je moet inloggen. Die pagina heeft geen doctype (dat gaat de html-validator ook melden). Zonder doctype is het vrijwel zeker dat je (grote) verschillen in weergave tussen verschillende browsers gaat krijgen.
 
'n Doctype vertelt de browser wat voor versie html en zo het is. Zonder doctype probeert elke browser er het beste van te maken, en dat is vaak niet zo heel best.
In het verleden had je geen echte standaard. 'n Doctype is 'n methode om de browser te vertellen dat jouw pagina aan de standaard voldoet, en dat de browsers het dus volgens de standaard moeten weergeven in plaats van elk op hun min of meer eigen manier.
'n Strict doctype is eigenlijk het beste, maar dan kun je 'n hele serie verouderde tags niet meer gebruiken, zoals <center>. Bij 'n transitional doctype kan dat wel, maar dat is wel veel meer werk om iets te wijzigen. Bovendien blokkeert het het gebruik van de nieuwe dingen in de volgende versie van html, html5, die geleidelijk aan wordt ingevoerd.
Strikt:
HTML: 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
   "http://www.w3.org/TR/html4/strict.dtd">
Transtional:
HTML: 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
   "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
Dit zet je bovenaan je pagina. Het moet de allereerste regel zijn, er mag zelfs geen spatie voor staan.
Goeie kans dat je lay-out niet meer klopt als je 'n doctype toevoegt. Maar daar is niets aan te doen. Het is de enige manier om redelijk zeker te weten dat het in alle browsers hetzelfde werkt. Als er dingen veranderen door het doctype, is het enige wat je kunt doen die dingen aanpassen.
Daarom is het ook belangrijk gelijk met het doctype te beginnen, nog voor je iets anders doet.

Edit: je moet dus maar één doctype bovenaan zetten. Je kunt het ook lezen alsof je ze beide moet gebruiken, maar dat bedoel ik dus niet.
 
Laatst bewerkt:
Hallo weet iemand hoe het komt dat dit niet werkt in firefox en wel in IE?
(...)
normaal moet er bij een H2 een image achtergrond staan. Bij IE doet hij het maar bij firefox doet hij dat niet.
h2 {
...
background: #CAE8EA url(images/bg_header.jpg) no-repeat;
...
}
www.kaoudenaarde.be/examen8/EXAMEN/gip2010/eindwerk/admin_bestelling.php
www.kaoudenaarde.be/examen8/EXAMEN/gip2010/eindwerk/style.css
Klik om te vergroten...
Het merkwaardige is, dat in de (niet correcte) html van de inlog-pagina helemaal geen link naar het (evenmin correcte) css-bestand staat. Dan kan de bg_header.jpg nooit getoond worden (ook niet als de css goed is), ook niet in IE. :eek:
En ook staat op de inlog-pagina helemaal geen <h2>. Dan kan de bg_header.jpg al helemaal niet getoond worden. :eek:
Moet het soms een andere pagina zijn?
Of is er iets met de php mislukt?

- Maar de html- en css-foutjes vragen wel ernstig om verbetering, zoals door Goeroeboeroe aangegeven; plus toevoegen Doctype, en ook toevoegen een meta-regeltje met de utf-8 charset:
Code: 
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
... enz.
(weglaten is één van de html-errors; hiermee weten browsers hoe ze de lettertekens moeten interpreteren in de rest van de code)

Met vriendelijke groet,
CSShunter

PS
De www.kaoudenaarde.be/examen8/EXAMEN/gip2010/eindwerk/images/bg_header.jpg staat in elk geval in het door de css aangegeven mapje op de server. Dus daaraan kan het niet liggen. ;)
 
Ja het is niet op deze pagina dat een <h2> staat. Want ik werk met een inlog systeem en kan daarom de andere pagina's niet tonen.
 
Aha. Maar ik ben 'n beetje bang dat ik niet echt helderziend ben. Er gaat kennelijk iets mis bij jou. Dat moet in je code zitten. Als ik je code niet kan zien, tja...
 
Status
Niet open voor verdere reacties.
                    Steun ons                    

Nieuwste berichten

Terug
Bovenaan Onderaan