so, die sache ist gerade von mir gelöst worden
@flo: uiui, mein junger padavan
da hast aber ganz ganz viel an kritikmöglichkeiten an mich weitergegeben *hehe* - nein, im ernst! folgende punkte:
- warum gibst du einer
relativ positionierten ebene einen left-wert?? weg damit
- warum kennzeichnest du die ebenen in der entwicklung nicht mit dünnen rahmen (damit man sieht, wie sie liegen)? bzw. mit einer hintergrundfarbe (ist besser, aufgrund des box-model-bugs)
- warum postitionierst du neben einer links-gefloateten ebene die rechte daneben nicht mit einem entsprechenden margin-left-wert?
so sah der falsche css-code aus (.linkcontainerBild -> bild, .linkcontainerText -> Text dazu rechts (dieser link funktioniert natürlich, da diese ebene die bildebene überlagert):
Code:
.linkcontainerBild {
margin: 0px;
padding:0px;
height:auto;
text-align: left;
float: left;
/* meine zusätze zum visualisieren */
border: 1px solid red;
}
.linkcontainerText {
position: relative;
left: 5px; /* bei pos-relative ein "left-wert"??? */
margin: 0px;
margin: 0px; /* großer fehler !!! */
padding-left:10px;
height: 75px;
text-align: left;
line-height: 75px;
vertical-align: middle;
/* meine zusätze zum visualisieren */
border: 1px solid blue;
}
für alle, die auch mal solche probleme haben, hier 3 screenshots:
1. so sah die
falsche seite im ie6 aus (der interpretiert ja css in vielerlei hinsicht falsch, sodass er die falsche darstellung richtig rübergebracht hat):
2. so sah die
falsche seite z.b. im op7 aus (er rendert RICHTIG) - achtet auf die blau umrandete ebene, welche das bild beinahe ganz miteinnimmt --> weil kein margin-left gegeben wurde!!!
dadurch wird
nur der äußerst linke rand des bildes (wo die blaue ebene nicht mehr hinlangt)
auch als link erkannt!!!
hier der in diesem problembereich richtiggestellte code:
Code:
.linkcontainerBild {
margin: 0px;
padding:0px;
height:auto;
text-align: left;
float: left;
/* meine zusätze */
border: 1px solid red;
width: 100px; /* da die bilder ja alle 100px breit sind */
}
.linkcontainerText {
position: relative;
/*left: 5px;*/
/*margin: 0px;*/
margin-left: 110px; /* linker container 100px + 10px = 110px vom linken rand */
padding-left:10px;
height: 75px;
text-align: left;
line-height: 75px;
vertical-align: middle;
/* meine zusätze */
border: 1px solid blue;
}
3. nach
richtigstellung der definitionen zeigt sich ein anderes - richtiges bild (hier wieder op7):
mahh, ich hab ja sooo eine schöne handschrift in fireworks *hehe*
