Just nu i M3-nätverket
Gå till innehåll
ramo_and

Position: fixed funkar inte i IE

Rekommendera Poster

Skulle lägga en div fixerad till botten på sidan och det funkar utmärkt i FF men såklart inte i Internet Explorer... koden ser ut så här:

 

.bottomField {
 positon: fixed !important;
 bottom: 0px;
}

 

Vad gör jag för fel?

Dela detta inlägg


Länk till inlägg
Dela på andra webbplatser

hehe jag kopierade inte koden utan skrev bara snabbt här så det blev ett slarvfel :P Det är IE8.. sidan ligger tyvärr inte uppe ännu. Fattar inte varför en sån enkel grej inte funkar. Funkar ju perfekt i t ex FF.

Dela detta inlägg


Länk till inlägg
Dela på andra webbplatser

Jaha, det förklarar ju varför det saknades då, dock förklarar det inte varför det inte funkar, som Anjuna säger så ska det funka utmärkt i både IE7 och IE8, men utan resten av koden är det svårt att säga vart det skiter sig nånstans..

 

Vart placerar den sig i IE då?

Redigerad av happyfejs

Dela detta inlägg


Länk till inlägg
Dela på andra webbplatser

Den placerar sig ovanför sidfoten, där en "ska" vara om jag inte ändrar positionen till fixed. Men det verkar vara nåt annat skumt med för firebug lite funkar inte på sidan heller.. FB lite funkar bra i IE på andra sidor jag designat men inte på denna...

Dela detta inlägg


Länk till inlägg
Dela på andra webbplatser

vad menar du med FB lite?

testa att skriv margin:0 !important och padding:0 !important på den också.

 

har du nollställt css:en?

 

Firebug lite.. som firebug fast för alla webbläsare. Man inkluderar ett skript så får man den på sidan fast den syns för alla som kollar på sidan då.

 

Jag testade att nollställa css:en men då blev det helt galet.. grejen e de att jag jobbar utifrån en mall på en webbutikssida (textalk.se) och då har nog dom gjort det tror jag..

Dela detta inlägg


Länk till inlägg
Dela på andra webbplatser

Jag gjorde en egen snabb testsida med enkel htmlkod där en div fick "position: fixed" och det funkade inte heller i IE.. så ska de väl inte vara?

Dela detta inlägg


Länk till inlägg
Dela på andra webbplatser

Ok! :)

 


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Testsida</title>

</head>
<body>

<style type="text/css">
#test {
 height: 20px;
 background: #000;
 position: fixed;
 bottom: 0px;
 width: 400px;
}
</style>


<div style="height: 2000px;">
<div id="test">test</div>
</div>

</body>

Dela detta inlägg


Länk till inlägg
Dela på andra webbplatser

Ok, det förklarar saken, du har angett fel doctype. Du måste använda strict om du vill få det här att fungera

 

Släng in det här i din testkod så ska du få se på magi =)

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-
strict.dtd">

Dela detta inlägg


Länk till inlägg
Dela på andra webbplatser

Nice! Det funkar ju :) Men hur ordnar jag med det på min webbutiks sida? Kan ju inte komma åt den koden. Går det att fixa med jQuery?

Dela detta inlägg


Länk till inlägg
Dela på andra webbplatser

Kan tillägga att du kan få det att fungera även med transitional, men då måste du inkludera uri:n till dtd:n, annars kommer IE att jobba i någon quirks-liknande mode. Men jag föreslår ändå att du jobbar helt enligt standard och kör på strict.

 

Varianten av transitional om du vill testa även denna

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

Dela detta inlägg


Länk till inlägg
Dela på andra webbplatser

Kan tillägga att du kan få det att fungera även med transitional, men då måste du inkludera uri:n till dtd:n, annars kommer IE att jobba i någon quirks-liknande mode. Men jag föreslår ändå att du jobbar helt enligt standard och kör på strict.

 

Varianten av transitional om du vill testa även denna

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

 

aah okej, problem e ju bara att jag inte kan ändra doctypen på butikssidan jag jobbar på.. :S Kommer inte åt den koden

Dela detta inlägg


Länk till inlägg
Dela på andra webbplatser
Men hur ordnar jag med det på min webbutiks sida? Kan ju inte komma åt den koden. Går det att fixa med jQuery?

Oj, knepigt. Problemet är ju att när webbläsaren väl har läst doctype-taggen så är renderingstypen satt. Det finns dock en meta-tagg för IE8 och högre som ser till att rendera enligt standard, trots en gammal doctype-tagg. Den ser ut så här:

<meta http-equiv='X-UA-Compatible' content='IE=8' />

 

Jag testade att skriva in den i head med jquery, vilket går bra, men det gör ingen skillnad i IE8. Troligen måste den finnas där från start för att det ska fungera.

Testade med följande, både som globalt script och i en document/ready-hanterare, men tyvärr.

$(document).ready(function () {
       $("<meta http-equiv='X-UA-Compatible' content='IE=8' />").appendTo("head");
   });

 

Hittar jag en work-around så återkommer jag.

Redigerad av Anjuna Moon

Dela detta inlägg


Länk till inlägg
Dela på andra webbplatser

En fråga - om du inte kommer åt källkoden på sidan, hur får du då in de här ändringarna du gör (ex. javascripten)?

 

Det finns fält där man kan lägga in egen html-kod. Så där lägger jag in javascripten då.

Dela detta inlägg


Länk till inlägg
Dela på andra webbplatser

Skapa ett konto eller logga in för att kommentera

Du måste vara medlem för att kunna kommentera

Skapa ett konto

Skapa ett nytt konto på vårt forum. Det är lätt!

Registrera ett nytt konto

Logga in

Redan medlem? Logga in här.

Logga in nu



×
×
  • Skapa nytt...