anoniem Geplaatst: 10 februari 2004 Delen Geplaatst: 10 februari 2004 Site: http://www.htb.firehosting.nl/anw/site/index.html Prob1: Achtergrond krijg ik niet zwart. 'k Heb het wel gedefineerd in CSS, maar nog niet goed :(, Het lukt wel als ik in de <body> tag doe, maarja, das geen CSS.[code:1:f7f1b93410]body { margin: 0px; background-color: #000000; background: url(dna.jpg) no-repeat center fixed; }[/code:1:f7f1b93410] Prob2 Krijg de titel niet verticaal gecentreerd. Heb geen hoogte ingesteld, als padding 10px. Dan moet de titel toch verticaal gecentreerd staan?[code:1:f7f1b93410]#titel_pagina { border: 3px solid #393; margin: 20px 20px 20px 20px; border: 5px solid #505050; padding: 10px; background: #CFCFCF; voice-family: "\"}\""; voice-family:inherit; }[/code:1:f7f1b93410] Vraagie, waar is de 'voice family' voor? 'k Heb de code van http://www.thenoodleincident.com/tutorials/box_lesson/boxes.html, niet zelf gemaakt dus. alvast bedankt ps. Voor het gemak css ff in html bestand gedrukt ipv apart .css bestand :D Quote Link naar reactie
anoniem Geplaatst: 10 februari 2004 Auteur Delen Geplaatst: 10 februari 2004 Je definieert niet alle properties in de background. Daar moet ook nog aan het begin color worden gedefinieerd: http://www.handleidinghtml.nl/css/eigenschappen/background/beschrijving.html [code:1:72baa2725a] <!-- einde details --> [/code:1:72baa2725a] Dit soort dingen mag je eigenlijk niet in een css-sheet zetten. Gebruik liever dit: /* */ Ik weet niet precies wat je niet verticaal gecentreerd vind aan je titel. Ik vind hem er aardig verticaal gecentreerd uitzien. Dit soort dingen: [code:1:72baa2725a] voice-family: "\"}\""; voice-family:inherit; } [/code:1:72baa2725a] wordt geloof ik een box model hack genoemd. Ik zou het zelf persoonlijk niet gebruiken, veel te lelijk. Er zijn makkelijkere manieren om het box model verschil van ie op te lossen. Geen idee waar voice-family voor dient. Moet je ergens op de w3c site voor css gaan kijken, als je het wil weten. Quote Link naar reactie
anoniem Geplaatst: 11 februari 2004 Auteur Delen Geplaatst: 11 februari 2004 [quote:a1c5c2b0c7]Dit soort dingen mag je eigenlijk niet in een css-sheet zetten. [/quote:a1c5c2b0c7]Sterker nog, je moet ze eruit laten. Per CSS specificaite (iig 2.1) hoort dat gewoon geparst te worden als een selector. Dus:[code:1:a1c5c2b0c7]<!-- main --> html{ font:1em sans-serif; }[/code:1:a1c5c2b0c7]Dan hoort de browser '<!-- main --> html' te selecteren en die een 'sans-serif' font te geven. Die selector matched uiteraard niks. Quote Link naar reactie
anoniem Geplaatst: 11 februari 2004 Auteur Delen Geplaatst: 11 februari 2004 Alvast bedankt, zal vanmiddag ff aanpassen. Dat commentaar tussen <!-- --> niet mocht, wist ik niet. Maar het is voor school (zoals jullie al gezien hadden) en het moet makkelijk aan te passen zijn. Vandaar heb ik commentaar er tussen gedrukt, zodat men weet wat waarvoor dient. Dus commentaar is noodzakelijk. Dat commentaar zou dan tussen /* */ moeten? Quote Link naar reactie
anoniem Geplaatst: 11 februari 2004 Auteur Delen Geplaatst: 11 februari 2004 Ja, zo werkt commentaar in CSS nu eenmaal, het is geen SGML of XML :-? Quote Link naar reactie
anoniem Geplaatst: 11 februari 2004 Auteur Delen Geplaatst: 11 februari 2004 [quote:76cdcaf7c5="termin8or"]Ja, zo werkt commentaar in CSS nu eenmaal, het is geen SGML of XML :-?[/quote:76cdcaf7c5]'k Kan niet alles weten. Maar ook verticale uitlijnig is gelukt. Het probleem zat hem in de titel. De titel was een <h1> en die heeft standaard een 'margin-bottom' van 10 ofzo. Nooit aan gedacht. Staat nu op 0, en werkt nu goed. Ook achtergrond ff goed gemaakt. Quote Link naar reactie
anoniem Geplaatst: 11 februari 2004 Auteur Delen Geplaatst: 11 februari 2004 H1 heeft ook een margin-top, margin-left en margin-bottom. En in sommige browsers padding. Het beste is om al deze te definieren:[code:1:a7ca796e8c]h1{ margin:0; padding:.2em; }[/code:1:a7ca796e8c]Dit geldt natuurlijk niet alleen voor het H1 element, elk element heeft een aantal standaard 'dimensies', het beste is om het voor elk element ook in te stellen. Quote Link naar reactie
anoniem Geplaatst: 11 februari 2004 Auteur Delen Geplaatst: 11 februari 2004 [quote:6d13924bb9="termin8or"]H1 heeft ook een margin-top, margin-left en margin-bottom. En in sommige browsers padding. Het beste is om al deze te definieren:[code:1:6d13924bb9]h1{ margin:0; padding:.2em; }[/code:1:6d13924bb9]Dit geldt natuurlijk niet alleen voor het H1 element, elk element heeft een aantal standaard 'dimensies', het beste is om het voor elk element ook in te stellen.[/quote:6d13924bb9]Nu valt me het op dat jij em's gebruikt. Wat is het verschil dan tussen em en px? en nog iets je hebt daar staan 'margin: 0;' zonder iets wat het is. Het kan nu px of em of % zijn. Tenminste, de CSS validator van W3C merkt het wel op. Quote Link naar reactie
anoniem Geplaatst: 11 februari 2004 Auteur Delen Geplaatst: 11 februari 2004 Ik maak maar geen nieuw topic, maar zet m'n vraag hier wel ff in; heb nu een half transparante achtergrond (png) in het linkmenuutje gedaan. Dit zie je wel goed in Opera, maar niet in IE. Kan ik hieruit concluderen dat IE geen 'alpha channel transparancy' ondersteund? Quote Link naar reactie
anoniem Geplaatst: 11 februari 2004 Auteur Delen Geplaatst: 11 februari 2004 Ja dat kun je concluderen. Een mogelijke fix: http://annevankesteren.nl/archives/2003/07/png-in-ie margin:0; is 100% correct. Want kun jij mij het verschil vertellen tussen '0ex', '0px' en '0%' om maar is wat eenheden te noemen? 'em' is gebaseerd op de hoogte van het 'font'. Preciese definitie ken ik niet, staat in de CSS spec ;-). Ik gebruik die zodat als de gebruiker z'n font-size verandert de margins ook mee veranderen etc. Quote Link naar reactie
anoniem Geplaatst: 11 februari 2004 Auteur Delen Geplaatst: 11 februari 2004 [quote:291b6dd1c7="Johnny321"]Kan ik hieruit concluderen dat IE geen 'alpha channel transparancy' ondersteund?[/quote:291b6dd1c7]Yep. :([quote:291b6dd1c7="Johnny321"]Wat is het verschil dan tussen em en px?[/quote:291b6dd1c7][i:291b6dd1c7]px[/i:291b6dd1c7] is het aantal pixels, en dus een absolute afmeting. [i:291b6dd1c7]em[/i:291b6dd1c7] is de breedte van de hoofdletter M van het huidige lettertype bij de huidige grootte, en is daarmee relatief. Op deze manier kan een marge meeschalen met de fontkeuze en -grootte.[quote:291b6dd1c7="Johnny321"]je hebt daar staan 'margin: 0;' zonder iets wat het is. Het kan nu px of em of % zijn.[/quote:291b6dd1c7]Of het 0px, 0em of 0% is maakt feitelijk niets uit, de afmeting blijft hetzelfde. Daarom is doorgaans de ongeschreven regel dat de eenheid er niet bij wordt vermeld. Dit geeft ook extra leesbaarheid en alle bytes helpen. ;) [b:291b6dd1c7]Edit:[/b:291b6dd1c7] Damn you, termin8or! :D - Bas Quote Link naar reactie
anoniem Geplaatst: 11 februari 2004 Auteur Delen Geplaatst: 11 februari 2004 [quote:7ef396e3a7="termin8or"]Ja dat kun je concluderen. Een mogelijke fix: http://annevankesteren.nl/archives/2003/07/png-in-ie margin:0; is 100% correct. Want kun jij mij het verschil vertellen tussen '0ex', '0px' en '0%' om maar is wat eenheden te noemen?[/quote:7ef396e3a7]bij de waarde 0 hoeft dus niet altijd een eenheid te staan, als ik het goed begrijp. [quote:7ef396e3a7="termin8or"] 'em' is gebaseerd op de hoogte van het 'font'. Preciese definitie ken ik niet, staat in de CSS spec ;-). Ik gebruik die zodat als de gebruiker z'n font-size verandert de margins ook mee veranderen etc.[/quote:7ef396e3a7]Over nagedacht dus :D, kzal wel ff in de CSS spec. kijken. Quote Link naar reactie
anoniem Geplaatst: 11 februari 2004 Auteur Delen Geplaatst: 11 februari 2004 Bas, dat van 'em' en 'M' klopt niet -> http://www.alistapart.com/discuss/elastic/#c6155 Quote Link naar reactie
anoniem Geplaatst: 11 februari 2004 Auteur Delen Geplaatst: 11 februari 2004 ha, bas en termin8or, allebei bedankt, we kruisen elkaars wegen zie ik :lol: Quote Link naar reactie
anoniem Geplaatst: 11 februari 2004 Auteur Delen Geplaatst: 11 februari 2004 termin8or, wat is volgens jou het verschil tussen [i:2f41ab11e1]em[/i:2f41ab11e1] en [i:2f41ab11e1]ex[/i:2f41ab11e1]? Het gaat wel degelijk om de breedte van het element, niet om de hoogte. Overigens werd ik niet echt wijzer van de definitie die jij me gaf. [b:2f41ab11e1]Edit:[/b:2f41ab11e1] Check, gevonden: http://www.w3.org/TR/CSS1#length-units - Bas Quote Link naar reactie
anoniem Geplaatst: 11 februari 2004 Auteur Delen Geplaatst: 11 februari 2004 [url]http://www.w3.org/TR/CSS21/syndata.html#length-units[/url][quote:7426efea0a][list:7426efea0a][*:7426efea0a]em: the 'font-size' of the relevant font[*:7426efea0a]ex: the 'x-height' of the relevant font[/list:u:7426efea0a][/quote:7426efea0a]Dus als je het lettertype op een bepaald element op 12px gezet hebt en je geeft hem vervolgens een 1.5em padding-left is dat gelijk aan 1.5*12px = 18px. Op die manier kun je wel 'px' gebruiken voor fonts (wat overigens geen absolute eenheid is) en het geheel wel schaalbaar houden (maar dan niet in IE). Quote Link naar reactie
anoniem Geplaatst: 11 februari 2004 Auteur Delen Geplaatst: 11 februari 2004 Weten we direct wat het verschil tussen em/px is :lol: maar nu nog een vraagje, de oplossing die termin8tor gaf omtrent dat alpha channel transparancy werkt wel bij losse plaatjes, maar niet bij achtergronden :( , weet iemand toevallig hoe dat toe te passen op een achtergrond? De fix had betrekking op het 'img' attribuut, maar het wordt niet gebruikt bij een achtergrond :( zie ook de site: http://www.htb.firehosting.nl/anw/site/index.html Quote Link naar reactie
anoniem Geplaatst: 11 februari 2004 Auteur Delen Geplaatst: 11 februari 2004 http://www.alistapart.com/articles/pngopacity/ Quote Link naar reactie
anoniem Geplaatst: 11 februari 2004 Auteur Delen Geplaatst: 11 februari 2004 Abbonoment op 'a list apart'? :lol: hartstikke bedankt Quote Link naar reactie
Aanbevolen berichten
Om een reactie te plaatsen, moet je eerst inloggen