/ 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
[CSS] padding bliver lagt til bredden i IE~
Fra : Steen Eiler Jørgense~


Dato : 08-04-03 11:21

Jeg har en menu bestående af links, som er defineret således:

a.menu:link {
font-weight: bold;
padding: 2px;
color: #FFFFFF;
background-color: #CC0000;
display: block;
border-bottom: 1px solid #FFFFFF;
width: 173px;
text-decoration: none;
}

visited, hover og active adskiller sig kun ved baggrundsfarverne.

Ovenstående kode giver, i IE5.5, en linkbox, der er 173 pixels bred, og som
har en padding på 2px - fuldstændig, som defineret. Men i IE6.0 bliver mine
links 177 pixels brede! Dvs. paddingen bliver lagt til bredden! Hvis jeg
sætter padding:0px, så bliver de 173 pixels brede igen.

Hvad dælen skal jeg gøre?

Min doctype er
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

--
Steen Eiler Jørgensen
"No, I don't think I'll ever get over Macho Grande.
Those wounds run...pretty deep."




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


Dato : 08-04-03 11:56

Steen Eiler Jørgensen skrev:

> Ovenstående kode giver, i IE5.5, en linkbox, der er 173 pixels
> bred, og som har en padding på 2px - fuldstændig, som
> defineret.

....som IE 4 fortolker standarderne

> Men i IE6.0 bliver mine links 177 pixels brede!
> Dvs. paddingen bliver lagt til bredden!

....i overensstemmelse med CSS-standarden.


> Min doctype er
> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
> "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

Dermed sætter du browseren i standard-mode. Søg på google efter
doctype switching - eller kig her:

<http://msdn.microsoft.com/library/default.asp?url=/library/en-us/dnie60/html/cssenhancements.asp>

Hvis du skal have det til at virke i tidligere IE-versioner kan
du bruge conditional-kommentarer.
--
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

Steen Eiler Jørgense~ (08-04-2003)
Kommentar
Fra : Steen Eiler Jørgense~


Dato : 08-04-03 12:57

"Jens Gyldenkærne Clausen" <jens@gyros.invalid> skrev

> > Ovenstående kode giver, i IE5.5, en linkbox, der er 173 pixels
> > bred, og som har en padding på 2px - fuldstændig, som
> > defineret.
>
> ...som IE 4 fortolker standarderne
>
> > Men i IE6.0 bliver mine links 177 pixels brede!
> > Dvs. paddingen bliver lagt til bredden!
>
> ...i overensstemmelse med CSS-standarden.

Oho - se, det var jeg ikke klar over! Det virker da umiddelbart
kontraintuitivt, at paddingen ikke tages af den forhåndenværende plads, men
okay

> > Min doctype er
> > <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
> > "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
>
> Dermed sætter du browseren i standard-mode. Søg på google efter
> doctype switching - eller kig her:
>
>
<http://msdn.microsoft.com/library/default.asp?url=/library/en-us/dnie60/htm
l/cssenhancements.asp>

Hm, spændende læsning! Tak for linket

> Hvis du skal have det til at virke i tidligere IE-versioner kan
> du bruge conditional-kommentarer.

Og hvad mener du så helt nøjagtigt med det? At jeg skal køre i quirks-mode,
hvis brugeren sidder med en IE5.5? Jeg ville jo helst køre i
standards-compliant mode...

--
Steen Eiler Jørgensen
"No, I don't think I'll ever get over Macho Grande.
Those wounds run...pretty deep."



Knud Gert Ellentoft (08-04-2003)
Kommentar
Fra : Knud Gert Ellentoft


Dato : 08-04-03 14:34

"Steen Eiler Jørgensen" <oz1sejREMOVETHIS@get2net.dk> skrev :

>Og hvad mener du så helt nøjagtigt med det? At jeg skal køre i quirks-mode,
>hvis brugeren sidder med en IE5.5? Jeg ville jo helst køre i
>standards-compliant mode...

Tidl. versioner (end 6) af IE kan ikke skifte mellem standard- og
quirksmode.

--
Knud - http://home13.inet.tele.dk/smedpark/
Når der svares på et indlæg, svar venligst under det citerede og
skær venligst det væk, du ikke svarer på, ellers ryger du i killfiltret.
Svar kun i nyhedsgruppen - tak! E-mails besvares ikke.

Steen Eiler Jørgense~ (08-04-2003)
Kommentar
Fra : Steen Eiler Jørgense~


Dato : 08-04-03 14:44

"Knud Gert Ellentoft" <knudgert@mail.tele.dk> skrev

> Tidl. versioner (end 6) af IE kan ikke skifte mellem standard- og
> quirksmode.

I see... Hvad tror du så, Jens mener med "conditional-kommentarer" -
browserdetektion? Særlige bredder i CSS'et for gamle IE-versioner?

--
Steen Eiler Jørgensen
"No, I don't think I'll ever get over Macho Grande.
Those wounds run...pretty deep."



Rune Glerup (08-04-2003)
Kommentar
Fra : Rune Glerup


Dato : 08-04-03 14:52

Steen Eiler Jørgensen skrev:

> "Knud Gert Ellentoft" <knudgert@mail.tele.dk> skrev
>
> > Tidl. versioner (end 6) af IE kan ikke skifte mellem standard- og
> > quirksmode.
>
> I see... Hvad tror du så, Jens mener med "conditional-kommentarer" -
> browserdetektion? Særlige bredder i CSS'et for gamle IE-versioner?

Det kan laves smartere. Den sikreste måde er at lave en boks med bredden
angivet og en boks inden i med padding angivet.

Se diskussioner af emnet:
<http://css-discuss.incutio.com/?page=BoxModelHack>
<http://www.info.com.ph/~etan/w3pantheon/style/abmh.html>

--
/Rune
w|http://kaboom.dk/

Jonas Koch Bentzen (08-04-2003)
Kommentar
Fra : Jonas Koch Bentzen


Dato : 08-04-03 19:49

Steen Eiler Jørgensen wrote:
>
> Det virker da umiddelbart
> kontraintuitivt, at paddingen ikke tages af den forhåndenværende plads

Både og. Hvis man nu har besluttet sig for, at ens element (boks) skal
indeholde f.eks. et billede, der er 400 pixels bredt, eller man har
besluttet sig for, at der skal være præcis 400 pixels til tekst - er det
så ikke irriterende, at den bredde ændrer sig, hvis man ændrer
paddingen, border eller andet?

--
Jonas Koch Bentzen

http://findhim.com/


Jens Gyldenkærne Cla~ (09-04-2003)
Kommentar
Fra : Jens Gyldenkærne Cla~


Dato : 09-04-03 13:07

Steen Eiler Jørgensen skrev:

> I see... Hvad tror du så, Jens mener med
> "conditional-kommentarer" - browserdetektion?

<http://labs.google.com/cgi-bin/keys?q=conditional+comments>

> Særlige bredder i CSS'et for gamle IE-versioner?

Præcis. Conditional Comments ses kun af IE-browsere (desværre kun
windowsudgaver), og man kan styre hvilke versioner de skal gælde
for. I tilfældet med css til quirksmodebrowsere skal kommentaren
gælde alle IE-versioner før nr. 6 - fx som følger:

   <!--[if lt IE 6]>
   <style type="text/css">
   /* CSS til IE 5.5 Win og tidligere */

   </style>
   <![endif]-->

Fordelen ved denne metode er at man ikke belaster browsere der
forstår standarderne korrekt med unødig css eller html.

Ulempen er at man ikke får Mac-IE'ere med.
--
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

Steen Eiler Jørgense~ (09-04-2003)
Kommentar
Fra : Steen Eiler Jørgense~


Dato : 09-04-03 13:45

"Jens Gyldenkærne Clausen" <jens@gyros.invalid> skrev

> Præcis. Conditional Comments ses kun af IE-browsere (desværre kun
> windowsudgaver), og man kan styre hvilke versioner de skal gælde
> for. I tilfældet med css til quirksmodebrowsere skal kommentaren
> gælde alle IE-versioner før nr. 6 - fx som følger:

Hm! Fikst... Jeg kan ikke lade være med at spørge: hvad er der nu galt med

<% if instr(request.servervariables("HTTP_USER_AGENT"),"MSIE") AND NOT
instr(request.servervariables("HTTP_USER_AGENT"),"6.0") then (...) %> ?

> Ulempen er at man ikke får Mac-IE'ere med.

Men Mac-brugere er jo sådan set også selv lidt ude om det...

Jens: du forklarede mig ovenfor, at IE6 nu var standards-compliant (hvis man
kører den i den mode). Det går jeg stærkt ud fra, at Mozilla 1.3 også er.
Kan du da forklare mig, hvorfor jeg ikke får det samme resultat i de to
browsere på siden
http://rumfart.dk/vis_test_div.asp?id=19

Er det IE6.0 eller Mozilla1.3, der er noget galt med (eller min kode )?

--
Steen Eiler Jørgensen
"No, I don't think I'll ever get over Macho Grande.
Those wounds run...pretty deep."



Jens Gyldenkærne Cla~ (09-04-2003)
Kommentar
Fra : Jens Gyldenkærne Cla~


Dato : 09-04-03 14:52

Steen Eiler Jørgensen skrev:

> Hm! Fikst... Jeg kan ikke lade være med at spørge: hvad er der
> nu galt med

(serverside browsersnipping)

Bortset fra at du skal opdatere koden når IE 6.5 eller 7 kommer, så
ikke noget.

> Er det IE6.0 eller Mozilla1.3, der er noget galt med (eller
> min kode )?

Et gæt vil være at IE misser noget. Jeg kigger på det senere.
--
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

Jens Gyldenkærne Cla~ (09-04-2003)
Kommentar
Fra : Jens Gyldenkærne Cla~


Dato : 09-04-03 14:58

Steen Eiler Jørgensen skrev:

> Kan du da forklare mig, hvorfor jeg ikke får det samme
> resultat i de to browsere på siden
> http://rumfart.dk/vis_test_div.asp?id=19

Kiggede lige på siden igen.

IE centrerer fejlagtigt den tyrkise boks på grund af text-align
center. Mozilla nøjes med at centrere teksten - sådan som den skal.
--
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 : 177554
Tips : 31968
Nyheder : 719565
Indlæg : 6408852
Brugere : 218888

Månedens bedste
Årets bedste
Sidste års bedste