heinetz: Zusammenhang width und max-width

Beitrag lesen

Hallo Forum,

ich baue gerade an der mobilen Version einer Website und dachte, ich wäre mit meinem CSS soweit durch, da teste ich mal auf Windows Mobile und es, wie sollte es anders sein, passt nicht ;(

Was Probleme bereitet sind meine Grafiken, denen ich realtive Grössen verpasst hatte. Soweit sogut, dass max-width auf dem IE 6 nicht geht aber man das mit JavaScript-Expressions lösen könnte, habe ich schnell herausgefunden. Allerdings fiel ich bei der Gelegenheit darüber, dass mir der Zusammenhang zwischen width und max-width nicht klar ist, denn ich beobachte z.B. ein Phänomen (nicht im IE sondern bei Opera):

#img {
margin: 0;
max-width: 100%;
}

... und das Bild wird auf die Grösse des Containers skalliert, aber nicht über seine eigenen Pixelmasse hinaus. Es ist maximal 100% (seiner selbst) breit. Woher das Bild weiss, dass es den Container zu 100% ausfüllen soll, ist mir hier schon nicht klar. Klar erscheint mir dagegen das Folgende:

#img {
margin: 0;
width: 100%;
}

... aber ganz konfus empfinde ich das max-width im Folgenden keinen Effekt mehr hat:

#img {
margin: 0;
width: 100%;
max-width: 100%;
}

kann mir das jemand erklären?

gruss,
heinetz