Top-Themen

AppleEntwicklungHardwareInternetLinuxMicrosoftMultimediaNetzwerkeOff TopicSicherheitSonstige SystemeVirtualisierungWeiterbildungZusammenarbeit

Aktuelle Themen

Administrator.de FeedbackApache ServerAppleAssemblerAudioAusbildungAuslandBackupBasicBatch & ShellBenchmarksBibliotheken & ToolkitsBlogsCloud-DiensteClusterCMSCPU, RAM, MainboardsCSSC und C++DatenbankenDatenschutzDebianDigitiales FernsehenDNSDrucker und ScannerDSL, VDSLE-BooksE-BusinessE-MailEntwicklungErkennung und -AbwehrExchange ServerFestplatten, SSD, RaidFirewallFlatratesGoogle AndroidGrafikGrafikkarten & MonitoreGroupwareHardwareHosting & HousingHTMLHumor (lol)Hyper-VIconsIDE & EditorenInformationsdiensteInstallationInstant MessagingInternetInternet DomäneniOSISDN & AnaloganschlüsseiTunesJavaJavaScriptKiXtartKVMLAN, WAN, WirelessLinuxLinux DesktopLinux NetzwerkLinux ToolsLinux UserverwaltungLizenzierungMac OS XMicrosoftMicrosoft OfficeMikroTik RouterOSMonitoringMultimediaMultimedia & ZubehörNetzwerkeNetzwerkgrundlagenNetzwerkmanagementNetzwerkprotokolleNotebook & ZubehörNovell NetwareOff TopicOpenOffice, LibreOfficeOutlook & MailPapierkorbPascal und DelphiPeripheriegerätePerlPHPPythonRechtliche FragenRedHat, CentOS, FedoraRouter & RoutingSambaSAN, NAS, DASSchriftartenSchulung & TrainingSEOServerServer-HardwareSicherheitSicherheits-ToolsSicherheitsgrundlagenSolarisSonstige SystemeSoziale NetzwerkeSpeicherkartenStudentenjobs & PraktikumSuche ProjektpartnerSuseSwitche und HubsTipps & TricksTK-Netze & GeräteUbuntuUMTS, EDGE & GPRSUtilitiesVB for ApplicationsVerschlüsselung & ZertifikateVideo & StreamingViren und TrojanerVirtualisierungVisual StudioVmwareVoice over IPWebbrowserWebentwicklungWeiterbildungWindows 7Windows 8Windows 10Windows InstallationWindows MobileWindows NetzwerkWindows ServerWindows SystemdateienWindows ToolsWindows UpdateWindows UserverwaltungWindows VistaWindows XPXenserverXMLZusammenarbeit

Darstellungsunterschiede zwischen IE 6 und Firefox...

Frage Entwicklung CSS

Mitglied: Tobi_

Tobi_ (Level 1) - Jetzt verbinden

17.09.2007, aktualisiert 20.09.2007, 6391 Aufrufe, 7 Kommentare

Hallo zusammen,
bin gerade dabei eine Homepage zu erstellen, hier könnt ihr euch davon ein Bild machen:
http://www.logopaedie-friedl.de/post/

Dabei treibt mich der IE in regelmäßigen Abstand in den wahnsinn, mit FF ist das Layout wunderbar und im IE verschiebt sich so manches um wenige pixel....

IE: 6.0.2900
FF: 2.0.0.3

Nun zu meinen konkreten Problemen:

1. Das Eselsohr rechts unten in der Ecke sollte möglichst bündig rechts angeordnet sein, sodass kein hintergrund durchblickt. Mit dem FF gelingt mir dies halbwegs, der IE lässt einen mehrere Pixel breiten Rahmen stehen!

2. Weiterhin soll die Impressum Angabe und das copyright unten bündig mit dem Ende der Webseite sein. Auch hier macht der IE (oder ich?!?) Fehler.

3. Die Menüleiste oben ist beim IE auch nach oben verschoben. FF zeigt sie weiter unten an..



Der "Inhalt" der Webseite befindet sich in einem IFrame der per Javscript dynamisch die höhe ändert.

Bitte zerfleischt mich nicht wegen dem altmodischen layout per div und css, kenn mich mit php etc. wenig aus....
Über andere Verbesserungsvorschläge würde ich mich natürlich auch freuen!

Wäre super wenn mir wer helfen könnte!

MfG Tobi

CSS:
/* CSS Document */
body {
font-family:Arial, Helvetica, sans-serif;
font-size:14px;
background-color:#faf2ca;
}
a:link {
text-decoration:underline;
color: #FFFFFF;
}
a:hover {text-decoration:none;}
a:visited {color: #FFFFFF}

.te_impressum{
font-size:10px;
color:#666666;
padding-left:400px;
}


.iframe {
width:80%;
position:absolute;
top:170px;
left:200px;
overflow:hidden;



}

.startseite_oben {
position:absolute;
top:0%;
left:0px;
z-index:10;
}
.startseite_links {
position:absolute;
top:170px;
left:0%;
width:166px;
height:391px;
}
.startseite_adresse {
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
color:#FFFFFF;
text-align:center;
/*Größen- und Positionsangaben*/
position:relative;
left:-8px;
top:150px;
width:140px;
z-index:30;

}

.startseite_menueleiste {
font-family:Arial, Helvetica, sans-serif;
font-size:18px;
color:#FFFFFF;
/*Größen- und Positionsangaben*/
position:absolute;
left:200px;
top:110px;
width:700px;
height:25px;
z-index:11;
}
.startseite_sprachenwahl {
position:absolute;
top:0px;
left:820px;
z-index:12;
width:131px;
height:33px;
}

.startseite_ankunft {
background-image:url(../gfx/startseite_ankunft.png);
background-repeat:no-repeat;
background-position:0px 0px;
position:relative;
top:0px;
left:0px;
width:715px;
height:532px;
}
.startseite_schriftzug_post {
position:relative;
top:-515px;
left:160px;
width:51px;
height:25px;
}
.startseite_eselsohr {
position:absolute;
top:453px;
left:645px;
width:158px;
height:158px;
z-index:20;
}
Mitglied: Henne
17.09.2007 um 20:46 Uhr
Hi, meine Idee:

hast Du mal versucht die (oder alle) Elemente in der CSS-Formatierung
auf margin:0px zu setzen?
FF interprtiert wohl automatisch vom Vater-Element dass du
im body-tag im html-Quelltext gesetzt hast.

Mehr Rat gibt mein Wissen in Trockenübung jetzt nicht her ;)

Gruß
Bitte warten ..
Mitglied: Tobi_
18.09.2007 um 23:53 Uhr
also mit dem margin:0px stimmt nun zumindest der abstand des eselohrs nach rechts!
im ff passt beide abstände perfekt, mit dem minimalen spalt unten im ie könnte ich aber leben...

das impressum und die menüleiste sind im ie aber immer noch falsch platziert.
Ich hoffe mir kann wer weiterhlefen!

Mfg Tobi


CSS:
/* CSS Document */
body {
font-family:Arial, Helvetica, sans-serif;
font-size:14px;
background-color:#faf2ca;
margin:0px;
}
a:link {
text-decoration:underline;
color: #FFFFFF;
}
a:hover {text-decoration:none;}
a:visited {color: #FFFFFF}

.te_impressum{
font-size:10px;
position:absolute;
color:#666666;
left:400px;
top:432px;
}


.iframe {
width:80%;
position:absolute;
top:170px;
left:200px;
overflow:hidden;
}

.startseite_oben {
position:absolute;
top:0%;
left:0px;
z-index:10;
margin:0px;
}
.startseite_links {
position:absolute;
top:170px;
left:0%;
width:166px;
height:391px;
}
.startseite_adresse {
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
color:#FFFFFF;
text-align:center;
/*Größen- und Positionsangaben*/
position:absolute;
left:3px;
top:160px;
width:140px;
z-index:30;

}

.startseite_menueleiste {
font-family:Arial, Helvetica, sans-serif;
font-size:18px;
color:#FFFFFF;
/*Größen- und Positionsangaben*/
position:absolute;
left:200px;
top:110px;
width:700px;
height:25px;
z-index:11;

}
.startseite_sprachenwahl {
position:absolute;
top:0px;
left:820px;
z-index:12;
width:131px;
height:33px;
}

.startseite_ankunft {
background-image:url(../gfx/startseite_ankunft.png);
background-repeat:no-repeat;
background-position:0px 0px;
position:relative;
top:0px;
left:0px;
width:715px;
height:532px;

}
.startseite_schriftzug_post {
position:relative;
top:-515px;
left:160px;
width:51px;
height:25px;
}
.startseite_eselsohr {
position:absolute;
top:455px;
left:649px;
width:158px;
height:158px;
z-index:20;
margin:0px;
}
Bitte warten ..
Mitglied: Henne
19.09.2007 um 21:21 Uhr
fein, einen Schritt weiter..

der body ist nur im Frame margin=0,
in der Hauptvorlage nicht, hier langt vermutlich ein margin-bottom:0px
Ausserdem fehlts bei startseite_menueleiste und
te_impressum.

Versuchs mal...

Gruß
Bitte warten ..
Mitglied: Tobi_
20.09.2007 um 09:05 Uhr
so nun stimmt fast alles pixelgenau, ff lässt nur beim eselsohr einen minimalen abstand rechts!
gelegen ist an der fehlenden definition des zeilenabstandes der <p> Elemente:
p {
margin-top:1em;
margin-bottom:1em;
}

mfg tobi




/* CSS Document */
body {
font-family:Arial, Helvetica, sans-serif;
font-size:14px;
background-color:#faf2ca;
margin:0px; /*Für dynamischen Iframe*/
/*border:0px; /*Für dynamischen Iframe*/
}

p {
margin-top:1em; /*Definiert zentral den Abstand zwischen <p> Elementen(Zeilenabstand)!!! WICHTIG!!!!!!*/
margin-bottom:1em; /*Definiert zentral den Abstand zwischen <p> Elementen!!!(Zeilenabstand) WICHTIG!!!!!!*/
}
a:link {
text-decoration:underline;
color: #FFFFFF;
}
a:hover {text-decoration:none;}
a:visited {color: #FFFFFF}

.te_impressum{
font-size:10px;
position:absolute;
color:#666666;
left:400px;
top:597px;
}


.iframe {
width:80%;
position:absolute;
top:140px;
left:200px;
overflow:hidden;
}

.startseite_oben {
position:absolute;
top:0%;
left:0px;
z-index:10;
margin:0px;
}
.startseite_links {
position:absolute;
top:170px;
left:0%;
width:166px;
height:391px;
}
.startseite_adresse {
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
color:#FFFFFF;
text-align:center;
/*Größen- und Positionsangaben*/
position:absolute;
left:3px;
top:155px;
width:140px;
z-index:30;

}

.startseite_menueleiste {
font-family:Arial, Helvetica, sans-serif;
font-size:18px;
color:#FFFFFF;
/*Größen- und Positionsangaben*/
position:absolute;
left:200px;
top:95px;
width:700px;
height:25px;
z-index:11;

}
.startseite_sprachenwahl {
position:absolute;
top:0px;
left:820px;
z-index:12;
width:131px;
height:33px;
}

.startseite_ankunft {
background-image:url(../gfx/startseite_ankunft.png);
background-repeat:no-repeat;
background-position:0px 0px;
position:relative;
top:0px;
left:0px;
width:650px;
height:542px;

}
.startseite_schriftzug_post {
position:absolute;
top:97px;
left:288px;
width:51px;
height:25px;
}
.startseite_eselsohr {
position:absolute;
top:464px;
left:647px;
width:158px;
height:158px;
z-index:20;
margin:0px;
}
.startseite_schrift {
position:absolute;
top:90px;
left:0px;
width:600px;
}

.startseite_saeaele {
position:absolute;
width:118px;
height:234px;
left:686px;
top:130px;
}
Bitte warten ..
Mitglied: Tobi_
20.09.2007 um 18:05 Uhr
so hier bin ich wieder....
diesmal anderes problem:

Meine Menüleiste ärgert mich. Im IE funktioniert alles wie gewollt, sprich die links ändern beim überfahren ihre farbe (auch im untermenü).

Im Firefox funktioniert der farbwechsel nur bei den links die ein untermenü besitzen! Beim Rest (Home,Reservierung,Anfahrt,Kontakt) tut sich nichts...

Woran könnte das liegen?

MfG Tobi




/* CSS Document */
body {
font-family:Arial, Helvetica, sans-serif;
font-size:14px;
background-color:#faf2ca;
margin:0px; /*Für dynamischen Iframe*/
}

/*Definiert zentral den Abstand zwischen Elementen(Zeilenabstand)!!! WICHTIG!!!!!!*/
p {
margin-top:1em;
margin-bottom:1em;}
li {
margin-top:1em; /*Leerraum zwischen Linktext und </a> bringt Listenelemente ganz zusammen*/
margin-bottom:1em;
}
ul {
margin-top:1em;
margin-bottom:1em; }
/*Definiert zentral den Abstand zwischen Elementen(Zeilenabstand)!!! WICHTIG!!!!!!*/


a:link {text-decoration:underline;color: #FFFFFF;}
a:hover {text-decoration:none; color:#FFFFFF;}
a:visited {color: #FFFFFF; text-decoration:underline;}


#horizontale_liste li
{
display: inline;
list-style-type: none;
padding:0px;
}

#horizontale_liste a:link {text-decoration:none; color:#FFFFFF;}
#horizontale_liste a:hover {text-decoration:none; color:#7e92ad;}
#horizontale_liste a:visited {color: #FFFFFF; text-decoration:none;}

.te_impressum{
font-size:10px;
position:absolute;
color:#666666;
left:400px;
top:597px;
}


.iframe {
width:80%;
position:absolute;
top:140px;
left:200px;
overflow:hidden;
}

.startseite_oben {
position:absolute;
top:0%;
left:0px;
z-index:10;
margin:0px;
}
.startseite_links {
position:absolute;
top:170px;
left:0%;
width:166px;
height:391px;
}
.startseite_adresse {
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
color:#FFFFFF;
text-align:center;
/*Größen- und Positionsangaben*/
position:absolute;
left:3px;
top:155px;
width:140px;
z-index:30;

}

.startseite_menueleiste {
font-family:Arial, Helvetica, sans-serif;
font-size:18px;
color:#FFFFFF;
/*Größen- und Positionsangaben*/
position:absolute;
left:120px;
top:95px;
width:700px;
height:25px;
z-index:11;

}
.startseite_sprachenwahl {
position:absolute;
top:0px;
left:820px;
z-index:12;
width:131px;
height:33px;
}

.startseite_ankunft {
background-image:url(../gfx/startseite_ankunft.png);
background-repeat:no-repeat;
background-position:0px 0px;
position:relative;
top:0px;
left:0px;
width:650px;
height:542px;

}
.startseite_schriftzug_post {
position:absolute;
top:97px;
left:288px;
width:51px;
height:25px;
}
.startseite_eselsohr {
position:absolute;
top:464px;
left:647px;
width:158px;
height:158px;
z-index:20;
margin:0px;
}
.startseite_schrift {
position:absolute;
top:90px;
left:0px;
width:600px;
}

.startseite_saele {
position:absolute;
width:118px;
height:234px;
left:686px;
top:130px;
}
Bitte warten ..
Mitglied: Henne
20.09.2007 um 20:50 Uhr
hi,

das globale a:hover ist #ffffff .... also weiß. Deshalb kein augenscheinlicher Effekt.

bei horizontale_liste ist a:hover = #7e92ad

hier überschneidet sich wohl eine Klasse die FF anders interpretiert.

gruß
Bitte warten ..
Mitglied: Tobi_
20.09.2007 um 22:30 Uhr
hallo,
auch wenn ich das globale a:hover, a:link und a:visited ausklammere ändert sich nichts.

Hab auch folgendes probiert:

#horizontale_liste a:link {text-decoration:none; color:#FFFFFF;}
#horizontale_liste a:hover {text-decoration:none; color:#7e92ad;}
#horizontale_liste a:visited {color: #FFFFFF; text-decoration:none;}
alles ausklammern, sodass nur das globale wirkt.

Hier ist dann jeder link wie auf der linken seiten der mailverweis. Trotzdem bleibt im firefox beim überfahren der menülinks(home,reservierung,anfahrt,kontakt) der unterstrich stehen...

Hmmm da liegt wohl was größeres im argen!
Bitte um Hilfe!

mfg tobi
Bitte warten ..
Ähnliche Inhalte
Windows Netzwerk
gelöst Nur Firefox mit Proxy bringt fehler, ohne Proxy geht es (11)

Frage von WinLiCLI zum Thema Windows Netzwerk ...

Webbrowser
Update Firefox ESR 45.9.0 auf ESR 52.0 (7)

Frage von Hajo2006 zum Thema Webbrowser ...

Exchange Server
gelöst Keine Verbindung zwischen Handys und MS Exchange Server 2010 mehr (6)

Frage von andreas1234 zum Thema Exchange Server ...

Neue Wissensbeiträge
Tipps & Tricks

Wie Hackt man sich am besten in ein Computernetzwerk ein

(34)

Erfahrungsbericht von Herbrich19 zum Thema Tipps & Tricks ...

Humor (lol)

Bester Vorschlag eines Supporttechnikers ever: APC

(15)

Erfahrungsbericht von DerWoWusste zum Thema Humor (lol) ...

Heiß diskutierte Inhalte
Webbrowser
Windows 7 unbeliebte Internetseite sperren (15)

Frage von Daoudi1973 zum Thema Webbrowser ...

ISDN & Analoganschlüsse
gelöst Splitter - RJ45 zu RJ11? (13)

Frage von Waishon zum Thema ISDN & Analoganschlüsse ...

LAN, WAN, Wireless
gelöst Suche Firmware Image für Cisco Aironet 1252 (10)

Frage von Herbrich19 zum Thema LAN, WAN, Wireless ...

Netzwerke
VLAN Verständnissproblem (9)

Frage von Dragan123 zum Thema Netzwerke ...