Avatar billede l3kris Nybegynder
20. august 2008 - 22:35 Der er 21 kommentarer og
2 løsninger

javascript/CSS vises korrekt i IE, men ikke i FF

På en php-side, jeg er ved at lave, er der nogle divs, som skal placeres ift midten. Det gør jeg ved i CSS at skrive

left: 50%;

og derefter med <body onload:"position()"> få javascript til at flytte den til siden.

divTag.style.marginLeft = divWidth/(-2);

Det virker upåklageligt i IE (både 6 0g 7), men i FF placeres div med venstre side på 50% og bliver ikke flyttet af javascript-funktionen.

Et andet sted har jeg et span, som har padding-top:10px, hvilket IE udfører korrekt, men igen viser FF denne linje for højt.

Hvad gør jeg?
Avatar billede keysersoze Ekspert
20. august 2008 - 22:42 #1
<div style="width: 100px; margin: auto;">indhold</div>

så bliver den centreret og du slipper for javascript-snask.

det er svært at vurdere hvad der er galt med din padding - måske er det ikke stylen men noget andet der er problemet, fx manglende doctype.
Avatar billede w13 Novice
20. august 2008 - 22:43 #2
Har du set i FF's fejlkonsol (Funktioner -> Fejlkonsol eller Tools -> Error Console) om den brokker sig over koden?
Avatar billede w13 Novice
21. august 2008 - 11:16 #3
Men:

<body onload:"position()">

skal nu nok være:

<body onload="position()">

hvis det ikke allerede er dét. =)
Avatar billede l3kris Nybegynder
21. august 2008 - 11:56 #4
@keysersoze: Sagen er, at de skal placeres i forhold til midten - ikke alle sammen lige midt i! Og så bliver det svært, hvis vinduet resizes, eller bare i det hele taget at få dem stillet op i forhold til hianden.

Et af divs'ene er dynamisk og bliver lavet on-the-fly af javascript, og der kan jeg med php give forskellige parametre, alt efter om det er IE eller FF, og det virker fint. Selvfølgelig kunne jeg også lave de andre dynamisk ved opstart, men det er bare så meget mere arbejde...

@w13: Ja, det er rigtigt. I min kode står det korrekt og virker fint nok, jeg skrev det bare forkert i min post foroven. Fejlkonsollen brokker sig en del:
"Advarsel: Fejl i tolkning af værdi for 'left'.  Erklæring droppet." Jeg har prøvet at skifte den til margin-left (eller rettere marginLeft, da det er i javascript), men det gør ikke nogen forskel - de flytter sig ikke.
Avatar billede w13 Novice
21. august 2008 - 12:06 #5
Hvis du klikker på det link, der er ved fejlen.

Fejlen er nok bare, at du ikke sætter "px" efter værdien. F.eks. skal din linje:

divTag.style.marginLeft = divWidth/(-2);

nok også være:

divTag.style.marginLeft = divWidth/(-2) + "px";

for at virke i FF.
Avatar billede w13 Novice
21. august 2008 - 12:06 #6
"Hvis du klikker på det link, der er ved fejlen."

=

Hvis du klikker på det link, der er ved fejlen, så ser du præcis den kode, der er gal. Hvad står der dér?
Avatar billede l3kris Nybegynder
21. august 2008 - 12:13 #7
+"px" gør ikke nogen forskel, desværre. Såvidt jeg ved antages et tal uden enhed af være i px.

Når jeg klikker på linket, vises kildekoden for siden, men de viser alle sammen bare øverst på siden, hvor der ikke er nogen relaterede scripts.

@keysersoze: doctype er xhtml 1.0 strict. Jeg har prøvet at skifte til andre doctypes uden resultat.
Avatar billede w13 Novice
21. august 2008 - 12:31 #8
Nej, FireFox vil altid brokke sig over værdier, som ikke har en angivelse bagefter. Internet Explorer sætter selv "px" bagpå, men FF forstår det ikke.
Avatar billede l3kris Nybegynder
21. august 2008 - 12:34 #9
Ok - men det ændrer egentlig ikke noget. De sidder stadig skævt :/
Avatar billede w13 Novice
21. august 2008 - 12:37 #10
Er der stadig fejl i fejlkonsollen? Kan vi evt. se et link?
Avatar billede l3kris Nybegynder
21. august 2008 - 12:45 #11
æhh, det er alle familiens billeder - ikke sikker på, at jeg vil have sådan et link liggende her til tid og evighed. Er der en måde, man kan PMe på her på eksperten?
Avatar billede w13 Novice
21. august 2008 - 12:48 #12
Nej, det er der ikke. Hmm. Har du mulighed for at lave en Dummy-side, som vi kan se så?
Avatar billede l3kris Nybegynder
21. august 2008 - 13:07 #13
Avatar billede l3kris Nybegynder
21. august 2008 - 13:15 #14
Mærkeligt. Nu virker det. Og jeg har ikke ændret noget. Et eller andet, som jeg har ændret tidligere, har åbenbart først taget effekt efter genstart af browseren. Det gør det jo lidt besværligt.

Nu er der kun det lille problem med padding tilbage.
Avatar billede l3kris Nybegynder
21. august 2008 - 13:20 #15
Giv lige lyd, når du har kigget på siden - så vil jeg slette dummy'en igen :)
Avatar billede w13 Novice
21. august 2008 - 13:31 #16
Du har fejl i width i denne linje:
    width:500;
hvor du skal indsætte px bagefter tallet. FireFox brokker sig over denne og siger "Erklæring droppet". Dvs. FireFox ignorerer helt linjen!

Derudover er der ikke noget, der hedder layer-background-color, så den skal vel bare slettes alle de steder, den forekommer? Du sætter den alligevel bare til det samme som background-color..
Avatar billede l3kris Nybegynder
21. august 2008 - 13:41 #17
det manglende px er rettet. Det gør nu ikke så meget, for netop denne bredde bliver senere defineret i createDiv-scriptet, så det passer til billedet.

layer-background-color er fra et Project Seven-script, og de plejer at have styr på deres CSS, så jeg lader det blive for crossbrowser-kompatibilitetens skyld.  Men du har ret - jeg ved ikke helt, hvad det gør godt for :)

Kan du finde padding-fejlen? den er i nærheden af "<!-- STARTOF TABLE CELL DISPLAY PHP CODE -->".
Avatar billede w13 Novice
21. august 2008 - 13:47 #18
layer-background-color er kun til gamle versioner af Netscape Navigator, som officielt "døde" i år. =)
I øvrigt mener jeg, at dit script er fra før 2004, så layer-background-color gør intet andet end at forvirre browserne.

Hvad er padding-problemet på siden?
Avatar billede l3kris Nybegynder
21. august 2008 - 14:03 #19
ok, det kan godt være, at jeg skal slette det.

Problemet med paddingen er, at teksten "hopper opad", fordi padding-top ikke bliver udført.Det gør padding-left sjovt nok, som kommer lige forinden.
Avatar billede olebole Juniormester
24. august 2008 - 16:40 #20
<ole>

Hvis du er interesseret i hjælp, skal du lade siden ligge tilgængelig. Ellers kan vi jo ikke hjælpe dig  =)

/mvh
</bole>
Avatar billede l3kris Nybegynder
24. august 2008 - 17:16 #21
Ja, den var lige smuttet. Jeg har ikke lukket noget, men (lang forklaring) mit IP-kamera gik pludselig ind og blokerede for port 80.
Hvis ikke der er hul igennem nu, så kommer det snart (når DNS-serveren har opdateret sin liste).
Avatar billede l3kris Nybegynder
01. oktober 2008 - 15:10 #22
Nå, jeg lukker for dummy-siden og vil gerne give 30 points til w13.

Padding-problemet har jeg opgivet at løse, så ingen points for det.
Avatar billede w13 Novice
01. oktober 2008 - 17:04 #23
:)
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview
Kategori
Vi tilbyder markedets bedste kurser inden for webudvikling

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester