2009 27 jul 2009

User agent Style Sheets: Mystery Margener i Google Chrome

I går, ligesom alle andre "Ground Hog Day", arbejdede jeg på nogle CSS / tableless layouts. Alt gik godt i IE 7, FF 3 og Chrome, indtil pludselig, så jeg nogle un-ignorable margener kun ses i Google Chrome. Selvom meget mærkeligt og worring, det var nogle nye fejl / spørgsmål, som jeg var kommet accross, var der endelig lidt krydderi i mit verdslige arbejde. Trist (men dejlig) det fik fastsættes inden for få minutter af sonden ...

Dybest set, Det lignede Google Chrome ignorerede min CSS Nulstiller (margin: 0px). Det faktisk var forårsaget af brugeren agent stylesheet (-webkit-padding-start: 40px). Så løsningen var at nulstille denne stil ved at sætte padding: 0 de opfører sig elementer.
En god måde at undgå dette problem sker for ethvert element er at bruge en global CSS Rest som følger

* {Margin: 0; padding: 0;}

Hvad er User agent Style Sheets (specifikation)?
Følgende uddrag er taget fra http://meiert.com/en/blog/20070922/user-agent-style-sheets/ , fulgt linket for at læse mere om User agent Style Sheets

CSS 1 introducerer ideen med, at hver bruger Agent (UA, ofte en "web browser 'eller' web-klient") vil have en standard style sheet der præsenterer dokumenter inden for en rimelig - men nok banalt - måde. CSS 2 siger, at der opfylder brugerens agenter skal anvende en standard style sheet (eller opfører sig som om de gjorde), og at en brugers agent standard-stylesheet skal præsentere elementerne i dokumentet sproget på måder, der opfylder de generelle præsentation forventninger til det dokument, sprog; CSS 3 er sandsynligvis af samme mening.

Da CSS specifikationerne lade det være op til implementeringer, om at bruge en "rigtig" style sheet til standard display eller ej, er det ikke forbavsende, at du ikke kan finde en standard style sheet i alle browsers installationsmappe. I modsætning til Microsoft Internet Explorer såvel som Opera, (og så vidt jeg ved) for eksempel gøre Gecko browsere som Firefox og Netscape Navigator (se efter "html.css"), men også Konqueror det temmelig nemt at forstå deres standard styling.


2008 2 august 2008

Indstilling af DOCTYPE i XSL

Sidste uge har jeg lavet en progessive HTML / CSS layout til en klient, testet det i IE6, IE7 og FF 3, virkede helt fint ... indtil! layoutet gik videre ned ad manufacting cyklus. Det mislykkedes. Page layout elementer gik bare over det hele, når HTML layout blev omdannet til XSL og XML anvendes til det ... Øv!

Kunne ikke sove ok i løbet af weekenden, i forventning om mandag morgen, når jeg bliver nødt til at løse dette SH **. Men nu har en lille oplevelse i behandlingen af ​​den slags situationer (Browser Quirks, jeg mener), jeg vidste, at det havde at gøre med noget andet, men DOCTYPE .... og det var ...

The Problem:
Du vil have kontrol over DOCTYPE, da din transformation vil omfatte en standard DOCTYPE eksplicit, og du layout vil være ude i et kast.

Løsningen:
XSLT specs giver output-metoder for at sætte en DOCTYPE af valg. Også for os UI udviklere, vil de emner af interesse være HTML-output-metoder og XML output metoder .

Nå! før du får keder sig, her er rettelsen.

For eksempel, hvis du havde følgende DOCTYPE i din HTML-version:. -

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

Så i XSL du ville have følgende: -

<xsl:output method="html" doctype-system="http://www.w3.org/TR/html4/loose.dtd" doctype-public="-//W3C//DTD HTML 4.01 Transitional//EN" indent="yes" />

og endelig! gør at din XSLT output adlyder DOCTYPE du har valgt.


NDK hjem | Udtrykke IT | udtrykke Smag | udtrykke Penmenship | udtrykke Awe | udtrykke mig