Archief - Fonts wisselen in IE en FF

Het archief is een bevroren moment uit een vorige versie van dit forum, met andere regels en andere bazen. Deze posts weerspiegelen op geen enkele manier onze huidige ideeën, waarden of wereldbeelden en zijn op sommige plaatsen gecensureerd wegens ontoelaatbaar. Veel zijn in een andere tijdsgeest gemaakt, al dan niet ironisch - zoals in het ironische subforum Off-Topic - en zouden op dit moment niet meer gepost (mogen) worden. Toch bieden we dit archief nog graag aan als informatiedatabank en naslagwerk. Lees er hier meer over of start een gesprek met anderen.
j

j design

Legacy Member
Hallo iedereen

Ik ben wat typografie aan het testen voor het web.
Daarstraks ben op een probleem gestoten dat ik helemaal niet snap.

Het probleem zit in IE VS FF, de rest heb ik nog niet bekeken.
In IE komt Rockwell juist en in FF wisselen ze. :s
Het is zeker geen goede omschrijving van het probleem, maar bekijk het zelf eens.

Naamloos document

Doe ik iets fout? Alvast bedankt

Pic van het probleem http://www.jdesign.be/userfiles/testsite/problem.jpg
X

Xavez

Legacy Member
Je CSS is sowieso vrij raar... Je laatste keuze in een font-stack moet altijd serif of sans-serif zijn. Elke computer heeft wel een serif of sans-sarif standaardfont. Het heeft dus geen zin om na serif of sans-serif nog een font te definiëren :).

That being said, het is aangeraden om in CSS shorthand de juiste volgorde te behouden, zeker bij de font-properties. Ik heb geen idee in welke versie van IE het probleem zich nu voordoet, maar dit zou al beter moeten zijn:

Code: 
body{
	background: #333;
	color: #FFF;
	font: normal 15px "Bookman Old Style", "Rockwell", serif;
}

h1 {
	color: #CCC;
	font: bold 20px "Bookman Old Style", "Rockwell", serif;
	display: block;
	padding: 0px 5px;
	margin: 20px 0px 0px 0px;

}

h2 {
	color: #FFF;
	font: bold 35px "Rockwell", serif;
	display: block;
	padding: 0px 5px;
	margin: 20px 0px 0px 0px;
}


Ik heb hier nu niet al te veel aangepast. Optimaal zou zijn om bijvoorbeeld ook de line-height nog toe te voegen (15px size op 20px line-height wordt dan 15px/20px). En eigenlijk kan je best ook altijd kijken naar de standaardwaardes van elementen. Een h-element wordt altijd in bold gezet en de body-text heeft altijd een normal gewicht, dus dat kan je eigenlijk al weglaten... h-elementen worden trouwens ook altijd als block weergegeven, dus het heeft meestal weinig zin om die opnieuw als block te bepalen. Spaart allemaal code uit. Ideaal krijg je dan zoiets als dit:

Code: 
body{
	background: #333;
	color: #FFF;
	font: 15px/20px "Bookman Old Style", "Rockwell", serif;
}

h1 {
	color: #CCC;
	font: 20px/40px "Bookman Old Style", "Rockwell", serif;
	padding: 0px 5px;
	margin: 20px 0px 0px 0px;

}

h2 {
	color: #FFF;
	font: 35px/40px "Rockwell", serif;
	padding: 0px 5px;
	margin: 20px 0px 0px 0px;
}

Met de waardes voor de font-size en dergelijke kan je nog altijd spelen natuurlijk :). Veel plezier!

(zie ook Fonts)
j

j design

Legacy Member
Met de waardes voor de font-size en dergelijke kan je nog altijd spelen natuurlijk . Veel plezier!
Klik om te vergroten...
:p dank u

Ja de volgorde van de font's ken ik wel. Het was enkel bij het proberen dat ik wat aan het wisselen ben gegaan.
Beter dat je ze allemaal al eens gezien hebt om te weten wat mogelijk is met de basis.
Ik schrijf er meestal normal bold ect bij om zeker te zijn. Op die enkele woordjes zal het niet komen?
X

Xavez

Legacy Member
j design zei:
:p dank u

Ja de volgorde van de font's ken ik wel. Het was enkel bij het proberen dat ik wat aan het wisselen ben gegaan.
Beter dat je ze allemaal al eens gezien hebt om te weten wat mogelijk is met de basis.
Ik schrijf er meestal normal bold ect bij om zeker te zijn. Op die enkele woordjes zal het niet komen?
Klik om te vergroten...
Ja en neen, 'tis de manier van redeneren =). Hier het woordje bold, daar een klasse minder... Met de hoeveelheid telefoons die via een tragere verbinding het web opgaan zijn we qua snelheid vaak terug naar 1999 gekatapulteerd. Bovendien is het sowieso een goeie oefening om je code te optimaliseren! Hoe sneller het laadt, hoe beter ;)
Het archief is een bevroren moment uit een vorige versie van dit forum, met andere regels en andere bazen. Deze posts weerspiegelen op geen enkele manier onze huidige ideeën, waarden of wereldbeelden en zijn op sommige plaatsen gecensureerd wegens ontoelaatbaar. Veel zijn in een andere tijdsgeest gemaakt, al dan niet ironisch - zoals in het ironische subforum Off-Topic - en zouden op dit moment niet meer gepost (mogen) worden. Toch bieden we dit archief nog graag aan als informatiedatabank en naslagwerk. Lees er hier meer over of start een gesprek met anderen.
Terug
Bovenaan