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, 6362 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 ..
Neuester Wissensbeitrag
Windows 10

Powershell 5 BSOD

(8)

Tipp von agowa338 zum Thema Windows 10 ...

Ähnliche Inhalte
Webbrowser
gelöst Firefox 50 downloads stocken ohne Internet Verbindung (2)

Frage von LordXearo zum Thema Webbrowser ...

Humor (lol)
Der Unterschied zwischen USA und USB

Link von BirdyB zum Thema Humor (lol) ...

Windows Server
AD Replikation zwischen untergeordneten Domäne zwingend? (4)

Frage von Gien-app zum Thema Windows Server ...

Webbrowser
Zero-Day-Lücke in Firefox bedroht Tor-Anwender (1)

Link von runasservice zum Thema Webbrowser ...

Heiß diskutierte Inhalte
LAN, WAN, Wireless
gelöst Server erkennt Client nicht wenn er ausserhalb des DHCP Pools liegt (28)

Frage von Mar-west zum Thema LAN, WAN, Wireless ...

Outlook & Mail
gelöst Outlook 2010 findet ost datei nicht (19)

Frage von Floh21 zum Thema Outlook & Mail ...

Netzwerkmanagement
gelöst Anregungen, kleiner Betrieb, IT-Umgebung (18)

Frage von Unwichtig zum Thema Netzwerkmanagement ...

Windows Server
Server 2008R2 startet nicht mehr (Bad Patch 0xa) (18)

Frage von Haures zum Thema Windows Server ...