Padding i mozilla.

13 svar · 428 visningar · startad av Jesper T 15 maj 2003

Jesper TMedlem sedan nov. 20017 144 inlägg

Frågan15 maj 2003 23:00#1

Padding left verkar inte funka i Mozilla i mitt exempel.
w3c validerar klockrent rätt både på html 4.01 och css.
* Jag har testat att sätta float åt både höger och vänster.
* Jag har testat att lägga till position:relative
* Jag har testat att ändra width:100%; till ett fast pixelmått
men då blev brädden olika i de olika läsarna.
Textlagret som innehåller texten och bilden på snubben till höger ligger i ett annat lager(kanske är underförstått?!).
Jag är rådlös... Vad göra?

#scroll1{
float:right;
height:272px;
width:100%;
padding-left:188px;
overflow:auto;
}

I.E. (Så jag vill att det skall se ut)
Mozilla (Så jag inte vill att det skall se ut)

elvelindMedlem sedan juli 2002167 inlägg

15 maj 2003 23:13#2

vilken ie läsare testar du i?

PalleMedlem sedan apr. 20003 174 inlägg

15 maj 2003 23:14#3

[r] Woops, såg inte att det var html 4.01.. :r

DarrenMedlem sedan dec. 2002789 inlägg

15 maj 2003 23:24#4

Utan att ha sett mer av din kod... Kan du testa detta:

#scroll1{
    float:right;
    height:272px;
    margin-left:188px;
    overflow:auto;
}

Jesper TMedlem sedan nov. 20017 144 inlägg

15 maj 2003 23:46#5

Ja, något hände, men scrollen försvann i mozilla och texten solm ligger utanför försvann och i I.E 6 så blev det även en horisontell scroll.

Jesper TMedlem sedan nov. 20017 144 inlägg

15 maj 2003 23:47#6

elvelind skrev:

vilken ie läsare testar du i?

I.E 6.0.2
Och
Mozilla 1.2.1

Så här "inofficiellt.... ;)" så kan jag lägga ut länken till sidan.

https://www.inovart.se/konstplikt/new.asp

PepeJeriaMedlem sedan feb. 2003774 inlägg

16 maj 2003 07:31#7

Anledningen till detta är IE:s buggiga box model implementering. Där margin, border o padding inkluderas i width:et på elementet.
Alltså är det Mozilla som gör rätt här och IE som gör fel.
IE 6 fungerar korrect om man använder sig av strict doctype.

Läs mer här:
http://css-discuss.incutio.com/?page=BoxModelHack

elvelindMedlem sedan juli 2002167 inlägg

16 maj 2003 07:47#8

man behöver inte använda en strict doctype för att få IE6 att uppföra sig rätt. bara använda rätt doctype.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> är den "riktiga" doctypen för 4.01 tran.

Jesper TMedlem sedan nov. 20017 144 inlägg

16 maj 2003 10:35#9

elvelind skrev:

man behöver inte använda en strict doctype för att få IE6 att uppföra sig rätt. bara använda rätt doctype.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> är den "riktiga" doctypen för 4.01 tran.

Och då menar du att det skall funka?

Jesper TMedlem sedan nov. 20017 144 inlägg

16 maj 2003 17:50#10

Bara genom att lägga till den där hemsideadressen i doctype så sabbas hela layouten i I.E och i Mozilla är den oförändrad.
Det kan ju bara tolkas som att allt har blivit "sämre".
http://www.konstplikt.com/new.asp
Vad skall göras?

Jesper TMedlem sedan nov. 20017 144 inlägg

18 maj 2003 08:40#11

Ok, jag skall alltså använda tabeller i stället?

PepeJeriaMedlem sedan feb. 2003774 inlägg

18 maj 2003 14:11#12

Du kan använda dig av div:ar, men då får du tänkta på IE buggiga implementering. Använd dig av hacket jag postade förut.
Eller så har du inte någon padding, border, eller margin på de yttre elementen för att få samma width i alla browsers.

Jesper TMedlem sedan nov. 20017 144 inlägg

20 maj 2003 15:04#13

Ok, men att det skall vara så krångligt och struligt så fattar jag ö.h.t. inte varför man skall strula med css.
Det får bli gamla tabelvarianten ett tag till tills dessa "buggar" är borttagna.
F-n att det skall vara så svårt att ha en css-standard som funkar likvärdigt i samtliga browsers. x(

PepeJeriaMedlem sedan feb. 2003774 inlägg

21 maj 2003 11:46#14

Nej, så farligt är det inte...
Det här borde väl lösa ditt problem (kanske)?

#scroll1
{
    height:272px;
    width:200px; /* önskad width */
    margin-left:188px;
    overflow:auto;
    background-color:red;
}