Jens R. rasmussen kom med denne ide:
> Anders wrote in dk.edb.internet.webdesign.html:
>> Ups - prøver igen...
>>
>> Jens R. rasmussen wrote in dk.edb.internet.webdesign.html:
>>> Jeg har et problem med IE8, idet mine bokse vises anderledes end
>>> i IE7 på en enekelt side! Jeg har læst om IE8's
>>> kompatibilitetstilstand, og slår jeg den til vises mine bokse
>>> igen pænt i IE8. Jeg har også læst at jeg kan kode mig ud af det
>>> med en pseudokode: "Hvis IE8 Så gå i kompatibiletesmode".
>>>
>>> Men det dækker vel over, at der er en fejl/uhensigtsmæssighed i
>>> mit css-dokument - og jeg vil jo hellere rette fejlen ved kilden.
>>> Men det er endnu ikke lykkedes mig.
>>>
>>> Hvad er problemet?
>>> Jeg har 3 bokse, en topbar (som skal ligge øverst i højden og
>>> fylde hele bredden), en menubar (som skal ligge under topbaren i
>>> venstre side men kun fylder 160px ) og en indholdbar (som ligger
>>> ved lige af menubaren under topbaren.
>>>
>>> På alle sider - bortset fra index-siden - fylder indholdet af
>>> topbaren kun 1 linje. Men på index-side fylder den 2 linjer, idet
>>> linje 2 dels består af en besøgstæller (som jeg henter fra min
>>> webhoteludbyder) dels en 'senest revideret'-dato (som jeg selv
>>> beregner).
>>>
>>> Alt virker perfekt i IE7. Og validering af css giver hverken fejl
>>> eller warnings. Men i IE 8 virker alle siderne også perfekt -
>>> bortset fra indexsiden, hvor linje 2 bliver placeret nedenfor
>>> (udenfor) topbaren.
>>>
>>
>> Du kan lægge en dummy-div ind i slutningen af din topbar
>> <div id="topbar">
>> ...
>> <div id="visitors">...</div>
>> <div class="clear"></div>
>> </div>
>>
>> Så kan du i din css kode lave en linje
>> ..clear {clear:both;}
>>
>>
>
> Tak Anders. Det virker - men jeg forstår ikke, hvad det er jeg gør
>
> Jeg brugte ikke class, men id, men ellers skrev jeg som du rådede til
> - og det fik de 2 interne div (Revision og visitors, som begge har
> float til hhv. venstre og højre) til at blive inden i topbar-diven.
> Men hvorfor? - og hvorfor bliver de ikke derinde når jeg ikke har
> dummy-div'en med?
>
> Jeg læste om "clear" i manualen (9.5.2 Controlling flow next to
> floats: the 'clear' property). Men må indrømme, at jeg ikke forstår
> hvad der står. Så måske du med et par korte sætninger vil fortælle mig
> - hvad den ekstra clear-div udretter?
> - og hvorfor den er nødvendig?
>
> mvh
> /Jens
Det med float, kan være en svær ting at få under huden.
Når du floater elementer, forsøger browseren at flytte tingene så de
passer ind i hinanden - selvfølgelig med de begrænsninger du giver.
Det gør to ting, som ikke altid er ønskeligt.
Den ene er, at den kan flytte ting man egentlig havde tænkt sig under
de floatede elementer op imellem dem.
Den anden er, at de floatede elementer, ligesom bliver taget ud af
dokumentets egentlige flow (lidt ligesom absolut positionerede),
hvilket kan gøre, at der regnes forkert når elementer der indholder
floatede elementer skal beregnes.
Til begge disse "uønskede" tilstande, er løsning et element, med en
clear:both;. Det stopper elementer efter de floatede fra at blande sig
med de floatede, og det gør at browseren kan beregne hvornår floatede
elementer stopper - og altså finde højde for elementer der indeholder
floatede elementer.
Ofte kan man i designet, bruge et allerede eksisterende elemnt, som man
blot tilføjer clear - andre gange er man nødt til at indsætte et der
gør det.
Birger
--
http://varmeretter.dk - billig, sund og hurtig mad
http://bbsorensen.dk