[css] ie en floats

[chris]

Ik heb op http://linux.websitevoorbeeld.nl/bizzsite/index2.html een ontwerp voor een site staan, het werkt perfect in FF en Opera, maar IE pakt de float: right; niet. Hij leest het als een align: right.

De relevante code:

Cascading Stylesheet:

div#extra {
        float: right;
        margin-right: 7px;
        background: url("../images/laptop.gif");
        width: 212px;
        height: 119px;
}

Weet iemand waar dit aan ligt (welke bug)?

[Geert.H]

Heb je misschien ook de code van je pagina?
Bij mij is het namelijk zo dat als ik float gebruik dat ik eerst het normale object (in jou geval de titelbar) neer moet zetten, en dan het gedeelte wat ik float

Ik kan natuurlijk ook gewoon je broncode bekijken
Maar ik bedoel dus

code:

<div id="head">
  <h1><span>bizzsite automatisering</span></h1>
</div>
<div id="extra">&nbsp;</div>

ipv
[code]
<div id="extra"> </div>
<div id="head">
<h1><span>bizzsite automatisering</span></h1>
</div>
[/code[

[ Voor 44% gewijzigd door Geert.H op 16-01-2005 23:04 ]

[sjaakaq]

Op mijn site heb ik dacht ik de ikmages left-floaten en dat werkt in IE alleen als je er "position: absolute" bijzet...

[chris]

Ghoekzema schreef op zondag 16 januari 2005 @ 23:02:
Heb je misschien ook de code van je pagina?
Bij mij is het namelijk zo dat als ik float gebruik dat ik eerst het normale object (in jou geval de titelbar) neer moet zetten, en dan het gedeelte wat ik float

Dan werkt het alsnog niet, of ik 'm na de #head of na het #menu plaats, het werkt alsnog niet. Heel vreemd

En een position: absolute is niet echt een optie, het is een schaalbare layout dus de positie is niet echt absoluut

[ Voor 14% gewijzigd door chris op 17-01-2005 00:16 ]

[Thijsmans]

leokennis schreef op zondag 16 januari 2005 @ 23:05:
Op mijn site heb ik dacht ik de ikmages left-floaten en dat werkt in IE alleen als je er "position: absolute" bijzet...

Dat komt door jouw onkunde, float:left werkt prima, ook in IE

Ik neem aan dat je het object aan de zijkant van dat plaatje overigens wel de tegenovergestelde float hebt gegeven?

[chris]

Prammenhanger schreef op maandag 17 januari 2005 @ 00:21:
Ik neem aan dat je het object aan de zijkant van dat plaatje overigens wel de tegenovergestelde float hebt gegeven?

Was dat tegen mij of tegen leokennis bedoeld? Want in mijn geval is het niet nodig, en volgens mij in zijn geval ook niet.

[raps]

Ik denk dat je het extra-element in header moet plaatsen en h1 naar links moet floaten.

[BtM909]

Ik denk zelf dat je opzet een klein beetje verkeerd is. Niet overal zondermeer divs voor gebruiken.

Gebruik bijvoorbeeld 1 div voor 't logo, de grijze balk en je menu. Het laptop plaatje kan je beter helemaal transparant maken (dus achtergrond kleur van je logo en menu blijft goed zichtbaar).
In die div float je je img gewoon rechts of zet je op position: absolute; top: 0; right:0;.

Ik heb nu ff geen tijd, zal proberen om straks ff een voorbeeld in elkaar te knallen

[chris]

Ik denk zelf meer dat het aan IE ligt: het idee klopt perfect, en in Firefox en Opera werkt het ook gewoon. En aangezien de layout schaalbaar is kan ik niet met position: absolute werken.

[BtM909]

chris schreef op maandag 17 januari 2005 @ 14:55:
En aangezien de layout schaalbaar is kan ik niet met position: absolute werken.

ik heb het over absoluut positioneren in een relatieve container

[chris]

BtM909 schreef op maandag 17 januari 2005 @ 15:00:
[...]

ik heb het over absoluut positioneren in een relatieve container

Hehe, my bad. Het werkt nu, dankje! Weer wat geleerd

[BtM909]

chris schreef op maandag 17 januari 2005 @ 15:15:
[...]


Hehe, my bad. Het werkt nu, dankje! Weer wat geleerd

Dacht vroeger ook altijd dat absolute, direct boven alles uitkwam

[Pjottski]

Even een kleine notitie: er vallen wel menu-items weg bij een resolutie < 1024 * 768

[chris]

Peedjeeh schreef op maandag 17 januari 2005 @ 15:21:
Even een kleine notitie: er vallen wel menu-items weg bij een resolutie < 1024 * 768

Dat was in IE wel zo, in FF/Opera werkt het prima dmv een min-width, maar nu heb ik voor IE het volgende gedaan:

[css]
* html #wrapper {
width:expression(document.body.clientWidth < 1000? "634px": "65%" );
}
[/css]

en het werkt goed.