[CSS] Alles goed in FF qua positie, maar in IE... - Softwareontwikkeling

donderdag 3 februari 2005 22:14

Acties:

Verwijderd

Topicstarter

ik heb mijn site even her styled omdat het totaal niet ging tussen ie en ff. Nu heb ik alles in orde gekregen voor ff maar nu doet het bijna niets in ie.
Ik heb gewerkt met de float prop. en en left-margin ingesteld. maar ook met position: fixed.
hieronder de link
http://users.skynet.be/jellepunk/MDR/tweak/
en hier zie je mijn CSS code

code:

body{
    font-family: century gothic, sans-serif;
    font-size: 12px;
    color: #000000;
    margin: 10px;
    background-color: #ffffff;
    text-align: left;
    padding: 5px;
    margin: 5px;

}
#intro{
    position: absolute;
    left: 50%;
    top:50%;
    margin-left: -350px;
    margin-top:-250px;
}

h2{
    color: #FF9E31;
    font-size: 16px;
    border: 1px solid #ccc;
    background-color: #F1F3F5;
    text-align: right;
}

a{
    color:#FF9E31;
    text-decoration:none;
}
a:visited{
    color:#FF9E31;
    text-decoration:none;
}
a:hover{
    color:#ccc;
    text-decoration:none;
}



#logo{
    text-align:left;
    float: left;
    border: 1px solid #ccc;
    width: 758px;
    padding: 5px;
    top: 5px;
    font-size: 10px;
}

#menu{
    position: fixed;
    float: left;
    top:128px;
    width: 150px;
}
#container{
    margin: 0 auto 0 auto;
}
#tekst{
    position: fixed;
    top:128px;
    float:left;
    border: 1px solid #ccc;
    width:424px;
    margin-left:155px;
    padding: 5px;
}

#fotos{
    position: fixed;
    top:128px;
    margin-left:594px;
    padding: 5px;
    border: 1px solid #ccc;
    width: 164px;
}

en hier mijn html code

code:

<?xml version="1.0" encoding="iso-8859-1"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
        "http://www.w3.org/TR/2000/REC-xhtml1-20000126/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <title>MDR</title>
    <link href="mdr.css" rel="stylesheet" type="text/css"/>
    </head>
    <body>
<div id="container">
    <div id="logo">
    
        <table border="0">
        <tr>
            <td>[img]"images/mdrverysmall.jpg"[/img]</td>
            <td>    
            <div id="logotekst">
                A&amp;A DECRUY (MDR) - Izegemsestraat 95 - 8800 Roeselare (Rumbeke) - België<br/>
                Algemeen : tel : +32 (0)51 20 54 95 - <a href="mailto:info@mdr.be?subject=e-mail via site MDR">info@mdr.be</a><br/>
                Fax Verkoop : +32 (0) 51 24 93 70 - Fax Inkoop : +32 (0) 51 20 58 76<br/>
            </div>
            </td>
        </tr>
        </table>

    </div>

    <div id="menu">
        <object type="application/x-shockwave-flash" data="menunl.swf" width="151" height="212">
        <param name="movie" value="menunl.swf" />
        </object>
    </div>


    <div id="tekst">
        <h2>MDR: een vaste waarde sinds 1947</h2>
        Meubelfabriek MDR werd gesticht door de broers Achiel en André Decruy in 1947.<br/>
        Sindsdien kende het bedrijf een constante en solide groei.<br/>
        Het familiebedrijf heeft momenteel tal van dochterondernemingen in diverse sectoren.<br/>
        
        <div id="stichters">
            [img]"images/stichter1.jpg"[/img] &nbsp; [img]"images/stichter2.jpg"[/img]<br/>
            Achiel en André Decruy
        </div>

        <h2>Tijdloos, sfeervol en budgetvriendelijk</h2>
        Kwaliteit en service zijn de topprioriteiten waarmee MDR in de loop der jaren een stevige reputatie bij de vakhandel wist op te bouwen.<br/>
        Onze specialiteit is het bekleden van uitgefreesde MDF-panelen en -profielen en we maken volop gebruik van de nieuwste trends in meubelbeslag, glasproducten en verlichtingsaccessoires.<br/>
        Het productengamma strekt zich uit van slaapkamermeubelen tot een breed modulair programma woon- en kantoormeubelen (Avanti en Optima).<br/>
        Zowel de afwerking als gebruikte materialen laten zien dat we duidelijk voor het betere gamma hebben gekozen. Ondanks hun kwaliteitsniveau blijven de MDR producten echter zeer betaalbaar.<br/>

    </div>

    <div id="fotos">
        [img]"images/bedrijf.jpg"[/img]<br class="2"/>
        [img]"images/designer.jpg"[/img]<br class="2"/>
        [img]"images/handarbeid.jpg"[/img]<br class="2"/>
        [img]"images/wagens.jpg"[/img]<br class="2"/>
    </div>  
   
    <div id="w3">
        <p>
        <a href="http://validator.w3.org/check?uri=referer">
        [img]"http://www.w3.org/Icons/valid-xhtml10"[/img]
        </a>
        </p>
    </div>

</div>
</body>
</html>

donderdag 3 februari 2005 22:18

Acties:

Verwijderd

IE herkent geen fixed position.
probeer het eens zo:

Cascading Stylesheet:

#menu{
    position:absolute;
    float: left;
    top:128px;
    width: 150px;
}
#menu[id] {
    position: fixed;
}

donderdag 3 februari 2005 22:31

Acties:

Verwijderd

Topicstarter

ja, dit is gelukt, bedankt maar als je nu kijkt rekent ie die padding en margin anders om en weet ik niet hoe ik dit kan verhelpen. Kan iemand me hierbij helpen?
hier is de link nogeens om het verschil aan te tonen
http://users.skynet.be/jellepunk/MDR/tweak/

donderdag 3 februari 2005 23:47

Acties:

iain

Full Flavor

Verwijderd schreef op donderdag 03 februari 2005 @ 22:31:
als je nu kijkt rekent ie die padding en margin anders om

daar zit gewoon een verschil in tussen FF en IE. Ben bang dat daar weinig aan te doen is, behalve een paar gare workarounds, zoals padding en/of margin weglaten. Je kan het dan met een plaatje oid opvullen, of er een div'je in plaatsen dat een bepaalde padding wél heeft. Daar zit je vast ook niet op te wachten...

I used to be an atheist, until I realised I was god.

vrijdag 4 februari 2005 07:44

Acties:

Verwijderd

Topicstarter

maw, niets aan te doen?

vrijdag 4 februari 2005 10:30

Acties:

Genoil

alles aan te doen! zoek eens wat op over box-model, standards-mode en quirksmode en de beschikbare manieren om de verschillen op te heffen. Het meest hip vandaag de dag zijn de goeie ouwe conditional comments:

code:

1	<!--[if IE><link rel="stylesheet" type="text/css" href="ie.css"><![endif]-->

vrijdag 4 februari 2005 10:40

Acties:

RM-rf

1 2 3 4 5 7 6 8 9

een andere CSS-hack is de aloude

Cascading Stylesheet:

1
2
3

* HTML BODY #logo {
   width: 590px;
}

welke dus door explorer-versies abusievelijk toegekend word, maar eigenlijk geignoreerd zou moeten worden (wat dus door mozilla, opera en KHTML ook gedaan wordt)

Intelligente mensen zoeken in tijden van crisis naar oplossingen, Idioten zoeken dan schuldigen