Hallo zusammen,
bisher habe ich meine CSS-Probleme immer u.a. durch Lesen in diesem Forum beheben können. Dafür schon einmal vielen Dank.
Jetzt habe ich allerdings ein Darstellungsproblem im IE6 und IE7, welches ich leider alleine nicht beheben kann...
Mehrere Elemente innerhalb eines Iframes (als roter Kasten auf dem ersten Bild sichtbar) werden nicht richtig positioniert und das graue Menü wird am unteren Rand zu früh abgeschnitten.
[Blockierte Grafik: http://www.medikalprodukte.de/assistent/cssfehler/ie6.jpg]
[Blockierte Grafik: http://www.medikalprodukte.de/assistent/cssfehler/ie7.jpg]
Eigentlich sollte die Seite folgendermaßen aussehen: (screenshot Firefox)
[Blockierte Grafik: http://www.medikalprodukte.de/assistent/cssfehler/firefox.jpg]
Hat jemand von euch eine Idee wie ich diese Darstellungsfehler beheben kann?
Hier ist einmal eine Testseite zu dem Projekt:
http://www.profis-pflegen.de/schutzbrillen/assistent/index.html
Schon einmal im Vorraus vielen Dank für eure Mühe.
Viele Grüße
Euer Stefan
PS: Das ist der CSS-Code des Iframes.
Code
*{
margin:0;
padding:0;
}
/*
Schliesst alles ein:
*/
html,body {
font:95% Arial, Geneva, Arial, Helvetica, sans-serif;
color:#000;
background:#fff;
margin:0;
padding:0;
height:100%;
border:0;
overflow:hidden;
}
/*
Links
*/
a {
color:#333333;
text-decoration: underline;
font-style:normal;
font-weight:bold;
}
a img {
border:0;
}
a:hover {
color:#333333;
text-decoration:underline;
}
/*
Überschriften
*/
h1,h2,h3 {
font-family:Tahoma, Geneva, Arial, Helvetica, sans-serif;
color:#000000;
background:transparent;
}
h1{
font-size: 1.0em;
}
h2{
font-size:0.8em;
}
h3{
font-size:0.7em;
}
/*
Kompletter Body inklusive Auswahlmaske:
*/
#container{
margin:0;
height:100%;
overflow:hidden; /* vorher auto*/
color:#000000;;
background:#ffffff;
width:510px;
}
/*
Auswahlmaske des Assistenten:
*/
#header{
background:#ffffff;
position:fixed;/*absolute;*/
top:0; left:0; right:0;
top:0px;
background:#efefef;
text-align:left;
padding-right:0px;
width:460px;
height:492px;
padding-left:0px;
margin-left:20px;
margin-right:20px;
border-bottom:2px solid #c0c0c0;
line-height:140%;
font-size:0.95em;
overflow:hidden;
border:medium;
border:2px solid #cecece;-moz-border-radius:14px 14px 14px 14px;
}
.auswahlstatuschecked{
background-color:#bed3a0; /* vorher #e2ecd5;*/
font-weight:bold;
border:6px solid #bed3a0;-moz-border-radius:7px 7px 7px 7px;/*#808080*/
color:#000000;
}
label.auswahlstatuschecked:hover{
background-color:#86ae4f;
border:6px solid #86ae4f;-moz-border-radius:7px 7px 7px 7px;/
}
.auswahlstatusunchecked{
background-color:#efefef;
font-weight:bold;
border:6px solid #DDDDDD;-moz-border-radius:7px 7px 7px 7px;
color:#000000;
}
label.auswahlstatusunchecked:hover{
background:#bed3a0;
border:6px solid #bed3a0;-moz-border-radius:7px 7px 7px 7px;/*#808080*/
}
#title{
font-size:1.4em;
font-weight:bold;
margin-bottom:3px;
width:440px;
height:28px;
margin-left:0px;
text-align:center;
}
#menue{
width:460px;
margin-bottom:10px;
padding-left:0px;
padding-top:10px;
padding-bottom:10px;
hight:621px;
}
/* Abstaende im Menue auf der linken Seite der Radiobuttons*/
#ja1, #ja2, #ja3, #ja4, #ja5, #ja6, #ja7, #ja8, #ja9, #ja10{
margin-left:15px;
}
.auswahl{
font-size:1.3em;
font-weight:bold;
margin:0px 0px 10px 0px;
padding-left:15px;
padding-top:5px;
}
div.eigenschaft:hover{
background-color:#f5f5f5; /*#dfdfdf;*/
padding-bottom:10px;
border-width:thin;
border-top-style:dotted;
border-top-color:#b6b6b6;
}
.eigenschaft{
padding-bottom:10px;
border-width:thin;
border-top-style:dotted;
border-top-color:#b6b6b6;
}
.letzteeigenschaft{
padding-bottom:10px;
border-width:thin;
border-top-style:dotted;
border-top-color:#b6b6b6;-moz-border-radius-bottomleft:14px;-moz-border-radius-bottomright:14px;
}
div.letzteeigenschaft:hover{
background-color:#f5f5f5;
padding-bottom:10px;
border-width:thin;
border-top-style:dotted;
border-top-color:#b6b6b6;-moz-border-radius-bottomleft:14px;-moz-border-radius-bottomright:14px;
}
.einprodukt{
min-height:120px;
/*Trennlinie*/
border-left:solid;
border-color:#87b45a;
border-width:thin;
border-bottom-style:dotted;
border-bottom-color:#b6b6b6;
}
/*
Kompletter Text der Produkte in den Ergebnissen:
*/
#gesamtzahl{ /* div-Bereich wo Zahl Treffer und Gesamtzahl stehen */
margin-top:500px;
width:460px;
padding-left:20px;
text-align:center;
padding-top:5px;
}
#treffer{
font-size:22px;
font-weight:bold;
}
#treffertext{
text-align:center;
font-weight:normal;
font-size:11px;
color:#808080;
}
.ergebnisse{
margin-top:5px;
height:1380px;
overflow:scroll; /* bisher 1630px */
position:relative;
border-top:solid;
border-top-color:#87b45a;
border-top-width:thin;
}
.produktinfos {
float:right;
width: 300px;
margin-top:5px;
}
.produkttitel{
font-size:1.0em;
font-weight:bold;
}
.artikelnr{
font-size:0.79em;
font-weight:normal;
}
.artnrfett{
font-weight:bold;
margin-right:17px;
}
.lieferzeit{
font-weight:bold;
font-size:0.79em;
}
.imglieferzeit{
margin-left:0.2em;
}
.kurzbeschreibung{
font-family:Tahoma,Helvetica,sans-serif;
font-weight:normal;
font-size:0.78em;
text-align:left;
}
.preis{
color:#0000ff;
font-weight:bold;
text-align:right;
width:290px;
}
.mwst, .versandkosten {
font-size:0.6em;
font-weight:normal;
text-align:right;
width:290px;
}
.produktbild{
margin-bottom:50px;
padding-left:10px;
}
.imgbasket{
margin-left:390px;
margin-bottom:20px;
#ffffd2;
}
.details{
}
/*
FÜR MOUSEOVER-Info zu Eigenschaften im Menü
*/
#dhtmltooltip{
position: absolute;
width: 150px;
border: 1px solid black;
padding: 2px;
background-color:lightyellow;
visibility: hidden;
z-index: 100;
font:#003580;
/*Unten wird ein Schatten erzeugt*/
filter: progid:DXImageTransform.Microsoft.Shadow(color=gray,direction=135);
}
#java{
color:#ff0000;
font-weight:bold;
font-size:larger;
}
#deaktiviert{
text-decoration:underline;
}
/*
Bei Null Treffern
*/
#nulltreffer, #nulltreffer2{
font-weight: bold;
font-size:17px;
color:#bb0000;
}
#beratung1{
margin-top:70px;
font-size: 15px;
}