/ Forside / Teknologi / Udvikling / HTML / Nyhedsindlæg
Login
Glemt dit kodeord?
Brugernavn

Kodeord


Reklame
Top 10 brugere
HTML
#NavnPoint
molokyle 11184
Klaudi 5506
bentjuul 3377
severino 2040
smorch 1950
strarup 1525
natmaden 1396
scootergr.. 1320
e.c 1150
10  miritdk 1110
Div+CSS på tværs af browsere
Fra : Jacob Atzen


Dato : 27-08-03 09:45

Hej NG,

Jeg sidder og bakser med at lave noget layout. Jeg benytter i den
forbindelse div'er + css istedet for gode gamle tabeller. Desværre
synes jeg ikke rigtig, at det helt lever op til forventningerne.

Det er et krav, at siden vises rimelig korrekt på tværs af de største
browsere - IE6/IE5 til Windows, IE og Safari til Mac og Mozilla.

Desværre har jeg ganske store problemer med at få layoutet til
tilnærmelsesvis at virke fornuftigt. IE6 på Windows og Mozilla på
Linux viser det næsten ens. Men IE5 til Windows og Mac browserne giver
nogen knap så opmuntrende resultater.

Så spørgsmålet er om, det er mig der gør noget galt. Eller om der
ganske enkelt ikke er ordentlig understøttelse for CSS på Mac og IE5?

Det jeg benytter div'er til er primært positionering af elementer,
samt at sætte størrelsen på de forskellige div'er. Dvs. float og
position attributerne i CSS.

--
Med venlig hilsen
Jacob Atzen

 
 
Anders Thorsen Holm (27-08-2003)
Kommentar
Fra : Anders Thorsen Holm


Dato : 27-08-03 10:43

Jacob Atzen wrote:

> Jeg sidder og bakser med at lave noget layout. Jeg benytter i den
> forbindelse div'er + css istedet for gode gamle tabeller. Desværre
> synes jeg ikke rigtig, at det helt lever op til forventningerne.

Min krystalkugle er desværre til reparation, så jeg kan desværre ikke
se, hvilken side, der er tale om.

> Så spørgsmålet er om, det er mig der gør noget galt. Eller om der
> ganske enkelt ikke er ordentlig understøttelse for CSS på Mac og
> IE5?

IE5 har en del problemer - herunder med at fortolke box-modellen
korrekt. Et blockelements bredde - f.eks. en div - skal regnes
således: total bredde = width + padding + border + margin. Man kan
snige sig uden om dette problem ved at benytte to div'er, hvor den
ene bruges til positionering og total bredde og den anden til margin,
padding og border.

Nu er det sjældent, jeg bruger IE5, men der skulle også være nogle
problemer med floats.

Generelt er IE5 til Mac dog *meget* bedre end IE5 til Windows - der
er faktisk tale om to helt forskellige programmer.

Men oplys lige en URL så jeg (og andre) kan tage et kig på sagerne.

--
Anders Thorsen Holm | http://www.daimi.au.dk/~zoolook/

Overvejer du at købe en DVD-afspiller? Så hold dig fra Fona!
Læs hvorfor: http://www.daimi.au.dk/~zoolook/?page=fona

Jens Gyldenkærne Cla~ (27-08-2003)
Kommentar
Fra : Jens Gyldenkærne Cla~


Dato : 27-08-03 11:16

Anders Thorsen Holm skrev:

> IE5 har en del problemer - herunder med at fortolke
> box-modellen korrekt.

De samme problemer kan også opstå i IE6 - her har man som
webdesigner bare mulighed for at undgå dem ved hjælp af doctype
switcing. IE6 har - i øvrigt ligesom andre nyere browsere - en
såkaldt doctype switch der gør det muligt at vise html-sider på to
forskellige måder: enten som tidligere versioner af IE eller også
sådan som de gældende webstandarder foreskriver.

Se mere om metoden her:
<http://gutfeldt.ch/matthias/articles/doctypeswitch.html> og her
<http://www.html.dk/artikler/00036/>


> Nu er det sjældent, jeg bruger IE5, men der skulle også være
> nogle problemer med floats.

En anden fejl er at text-align: center; virker på blokelementer.


> Men oplys lige en URL så jeg (og andre) kan tage et kig på
> sagerne.

Ja tak. Se også gerne Lasse Reichstein Nielsens glimrende
introduktion til at stille spørgsmål i gruppen her på

   <http://infimum.dk/HTML/hjaelpmig.html>
--
Jens Gyldenkærne Clausen
Svar venligst under det du citerer, og citer kun det der er
nødvendigt for at forstå dit svar i sammenhængen. Se hvorfor og
hvordan på http://usenet.dk/netikette/citatteknik.html

Jacob Atzen (27-08-2003)
Kommentar
Fra : Jacob Atzen


Dato : 27-08-03 11:51

Jens Gyldenkærne Clausen <jens@gyros.invalid> writes:

> > Men oplys lige en URL så jeg (og andre) kan tage et kig på
> > sagerne.
>
> Ja tak. Se også gerne Lasse Reichstein Nielsens glimrende
> introduktion til at stille spørgsmål i gruppen her på
>
>    <http://infimum.dk/HTML/hjaelpmig.html>

Hehe. Jeg har læst Raymonds originale tekst. Mit spørgsmål var
primært, hvorvidt det kan være rigtigt, at der er så stor forskel på
browsere, som jeg oplever. Men i skal da være velkomne til at tage et
kig på siden og give mig kritik (kun af implementeringen, designet er
jeg ikke herre over ):

<http://bv.interflow.dk>

--
Med venlig hilsen
Jacob Atzen

Jens Gyldenkærne Cla~ (27-08-2003)
Kommentar
Fra : Jens Gyldenkærne Cla~


Dato : 27-08-03 12:22

Jacob Atzen skrev:

> Hehe. Jeg har læst Raymonds originale tekst. Mit spørgsmål var
> primært, hvorvidt det kan være rigtigt, at der er så stor
> forskel på browsere, som jeg oplever.

Kort svar: ja.

Lidt længere svar: ja - og det er ikke så mærkeligt endda.
Understøttelse af (fælles) standarder har ikke været en
konkurrenceparameter i store dele af den periode den nuværende
browsere er udviklet i. Selv om css-standarderne har en del år på
bagen, er der stadig mange mangler i flere browseres
implementationer.

IE har desværre en speciel uheldig rolle her - for det første fordi
det først var med IE6 at Microsoft tog css-standarderne alvorligt
(o.k. - MacIE 5.1 var vist også ganske god), dernæst fordi IE6
stadig ligger langt bagefter øvrige nye browsere med hensyn til
css-understøttelse, og sidst men ikke mindst fordi udviklingen af
IE som selvstændigt produkt nu helt er standset.


> Men i skal da være velkomne til at tage et kig på siden og
> give mig kritik (kun af implementeringen, designet er jeg ikke
> herre over ):

Takker. Det er lettest at tage stilling til konkrete problemer.

Din side ser nydelig ud i IE6 og Mozilla 1.4. Opera 6.01 viser den
næsten perfekt (søgeboksen er røget en linje ned), mens Opera 7.11
har større problemer. I anden billedrække er kun det første billede
placeret korrekt, resten af rækken er tom. Tilsyneladende er rækken
drejet 90 grader nedad. 2. billede er så skjult bag kassen
"børnenettet", mens 3. billede og den afsluttende kasse "Butik og
medlemsskab" kan ses nedenunder indholdsrammen.
--
Jens Gyldenkærne Clausen
Svar venligst under det du citerer, og citer kun det der er
nødvendigt for at forstå dit svar i sammenhængen. Se hvorfor og
hvordan på http://usenet.dk/netikette/citatteknik.html

Jacob Atzen (27-08-2003)
Kommentar
Fra : Jacob Atzen


Dato : 27-08-03 13:02

Jens Gyldenkærne Clausen <jens@gyros.invalid> writes:

> Jacob Atzen skrev:
>
> > Hehe. Jeg har læst Raymonds originale tekst. Mit spørgsmål var
> > primært, hvorvidt det kan være rigtigt, at der er så stor
> > forskel på browsere, som jeg oplever.
>
> IE har desværre en speciel uheldig rolle her - for det første fordi
> det først var med IE6 at Microsoft tog css-standarderne alvorligt
> (o.k. - MacIE 5.1 var vist også ganske god), dernæst fordi IE6
> stadig ligger langt bagefter øvrige nye browsere med hensyn til
> css-understøttelse, og sidst men ikke mindst fordi udviklingen af
> IE som selvstændigt produkt nu helt er standset.

Så deraf kan jeg konkludere, at hvis jeg vil lave en side med et
layout der skal se tilnærmelsesvis ens ud på tværs af browsere, så
skal jeg bruge tabeller istedet for div+css?

Mit indtryk var, at et af argumentenre for at bruge div+css netop var,
at det var lettere at lave sider på tværs af browsere med dette. Det
har jeg måske misforstået?

> Din side ser nydelig ud i IE6 og Mozilla 1.4. Opera 6.01 viser den
> næsten perfekt (søgeboksen er røget en linje ned), mens Opera 7.11
> har større problemer. I anden billedrække er kun det første billede
> placeret korrekt, resten af rækken er tom. Tilsyneladende er rækken
> drejet 90 grader nedad. 2. billede er så skjult bag kassen
> "børnenettet", mens 3. billede og den afsluttende kasse "Butik og
> medlemsskab" kan ses nedenunder indholdsrammen.

Jeg oplever noget lignende med Konqueror. Har du nogen ide om, hvad
problemet skyldes?

--
Med venlig hilsen
Jacob Atzen

Jens Gyldenkærne Cla~ (27-08-2003)
Kommentar
Fra : Jens Gyldenkærne Cla~


Dato : 27-08-03 13:21

Jacob Atzen skrev:

> Så deraf kan jeg konkludere, at hvis jeg vil lave en side med
> et layout der skal se tilnærmelsesvis ens ud på tværs af
> browsere, så skal jeg bruge tabeller istedet for div+css?

Det kommer an på hvor mange browsere du vil tage hensyn til - samt
hvor nøjagtigt design du kræver. En del ting kan klares med
forskellige css-hacks, men du har ret i at tabelbaseret design
endnu er bredere understøttet end css-baseret design.

Der er jo ingen browserproducenter der vil fjerne
bagudkompatibiliteten i deres browser - derfor virker sider med
forældede koder også i nye browsere.


> Mit indtryk var, at et af argumentenre for at bruge div+css
> netop var, at det var lettere at lave sider på tværs af
> browsere med dette. Det har jeg måske misforstået?

Ikke helt. Nogle forskelle mellem Netscape og IE har så vidt jeg
husker også betydning for tabellayout. Men generelt skal man
benytte css til layout fordi det er det det er beregnet til. Der er
også flere ting der ikke kan laves med tabeller, men godt med css.

> Jeg oplever noget lignende med Konqueror. Har du nogen ide om,
> hvad problemet skyldes?

Mit umiddelbare gæt er at du har glemt at sætte værdier for padding
et eller flere steder. Hvis man vil have ensartet design er det en
god ide eksplicit at sætte alle elementer i boksmodellen - dvs.
margen, fyld (padding) og borders.
--
Jens Gyldenkærne Clausen
Svar venligst under det du citerer, og citer kun det der er
nødvendigt for at forstå dit svar i sammenhængen. Se hvorfor og
hvordan på http://usenet.dk/netikette/citatteknik.html

Søg
Reklame
Statistik
Spørgsmål : 177522
Tips : 31968
Nyheder : 719565
Indlæg : 6408672
Brugere : 218887

Månedens bedste
Årets bedste
Sidste års bedste