17 svar · 443 visningar · startad av Nellan
Som ni ser så blir sidan skum i FF eftersom iframen inte får plats i diven. Antar att det har med margin och padding att göra?
Jag kör med denna doctype <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> eftersom jag vill att sidan ska tolkas i quirks mode (på grund av iframe-buggen i IE). Kan jag lösa problemet genom att tvinga FF att använda quirks mode på något vis?
Tack på förhand!
Måste du ha en iframe?
Du kan ju göra själva diven scrollningsbar och det borde ge exakt samma effekt.
/RED Hade visst frågat dig det redan i en annan tråd och antar att du fortfarande måste ha en iframe. :)
Ja, jag vill ha en iframe :)
Anledning till detta är att div:en till höger har en height på 400 px + padding-bottom och padding-top på 10px, det blir alltså:
400 + 10 + 10 = 420px hög
Men IE som har en annan boxmodel räknar in paddingen i själva div:ven. Så i IE är den 380 px hög. Denna boxmodel funkar som tänkt när man har en standars compliance doctype i IE 6.
Du säger att du vill använda dig av quirks mode på grund av en iframe bugg i IE, vilken bugg då?
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
...utlöser quirks mode även i Mozilla.
Om du vill att bara IE ska vara i quirks mode kan du lägga till vad som helst före doctypen, tex en kommentar eller en xml-deklaration.
/me tycker inte om iframes :P
PepeJeria: Okej, men hur får man dem att använda samma boxmodel då? "Buggen" jag talar om är att IE i standards mode gärna sätter en horisontell scroll på iframen som är helt onödig.
zcorpan: Men då borde de ju visas likadant? :\
Enda sättet du kan få IE 6 att ha samma box model som övriga browsers är att använda dig av en standards compliance mode DOCTYPE.
Eftersom tidigare versioner av IE inte stöder DOCTYPE switching, kommer det ändå att tolka boxmodel på ett felaktigt sätt. Detta löser man dock genom ett CSS hack för att ge dessa browsers ett annat värde.
Följande kod + en DOCTYPE som sätter IE 6 i standards compliance mode löser problemet:
#meny
{
float: right;
\height:400px;
he\ight:360px;
\width: 153px;
w\idth:113px;
margin: 0;
padding: 20px;
background-color: #DADADA;
font-size: 13px;
font-weight:bold;
}
Första värdet är till IE 5.x och det andra (height/width minus padding) för browsers som förstår boxmodel på ett korrekt sätt.
Men då får jag ju en horisontell scroll på iframen, och det vill jag inte.
Kan du visa denna bugg? Nyfiken
Om du stänger <p> taggen ordentligt, och ändrar dess marginal så kommer scrollbaren att försvinna.
Jaså? Men om jag tar bort <p> och kör med <br> istället då? Kolla igen.
Hmm...
Det där kommer antagligen inte heller att hjälpa...
MSIE är nämligen mycket piggare på att lägga ut en horisontell scrollbar i frames och iframes i standards compliance mode än i quirky mode om man inte aktivt definierar hur man vill ha det med "scrollingen" genom att t.ex. smäcka dit stildefinitionen
<style tyle="text/css">
<!--
html {overflow-x:hidden; overflow-y:[red][s]auto[/s][/red]scroll}
-->
</style>
på varje sida som laddas in i iframen... ;)
Det framgår också om man gör "view source" på de olika filerna i följande exempel:
HTML 4 Transitional: http://member.webforum.nu/2241/iframescrollertest1.html
xhtml 1.0 Transitional: http://member.webforum.nu/2241/iframes_i_xhtml.html
OBS! att problemet inte verkar uppkomma i annat än MSIE och att de tre alternativen i varje exempel förmodligen ser identiska ut i Mozilla/Opera osv "icke-MSIE"-webbläsare
:birp
//Red: Ändrat till overflow-y:scroll (se nedan)
jarvklo: Mjo.. fast jag ser ett litet fel på din exempel-sida för html 4 transitional. På iframen längst ner står det ovanför att du satt "overflow-x:hidden och overflow-y:auto inställda för html-taggen", men det stämmer inte!
Du har satt overflow-y:scroll; och det ger inte riktigt samma resultat. Sätter du auto så går texten in bakom scrollbaren, och när man har scroll så är ju scrollen där jämt.. alltså även om innehållet bara är på tex en rad.
Hur som helst: Tack till alla som försökt hjälpa :)
Ajdå :r
Får skylla på att exemplen har något år på nacken och att jag måste ha slarvat då :r
Nu är det hursomhelst fixat - ledsen bara att vi inte lyckades klura fram en bra lösning åt dig :(
zcorpan: Men då borde de ju visas likadant? :\
varför då? det är två olika webbläsare... de beter sig olika i standards compiance mode också.
Men att slopa standards compliance mode endast för den här buggen vore ju lite synd. Ibland krävs det fulhack för att undvika buggar, och enklast då är att sätta en width på 443px på bodyn i iframen, fast detta endast för IE dock, så kör med:
/* Till bodyn i iframe:n */
*html body { width:443px; }
Ja, det funkade! Tack!