Meine Website wird falsch angezeigt

Computer: Software & Programmierung HTML & CSS
#1

Hallo liebe Com,

Ich habe eine Website erstellt die mir leider mit 2 Browserns falsch dargestellt wird.

Firefox und Google Chrome zeigen sie richtig an.
Jedoch Opera und Internet Explorer nicht.
In Opera und IE werden die Buttons und die Hintergrundbilder versetzt, u.A bewegt sich die Navigationsliste ein bisschen nach unten wenn man mit der Maus drüber geht.
Ich habe schon alles mithilfe von metatags etc versucht.

Kann sich jemand die index und style.css datei angucken und ggf. reparieren? Wäre eine sehr große Hilfe für mich.

Die Url meiner Homepage ist: www.frost-world2.org

LG lordluigi

#2

Hallo lordluigi,

damit bist du nicht alleine :wink: Damit du möglichst guten Code schreibst, empfehle ich dir das hier:

-> http://validator.w3.org/

Du hast die Kommentare falsch gemacht:

-> http://de.selfhtml.org/html/allgemein/kommentare.htm

VERSUCH:

VERBESSERT:

Lass nochmal den Validator drüber und behebe die Fehler und versuche Formatierungsangaben wie Farben, Positionen usw. in deine CSS-Datei auszulagern. Vieles wird übersichtlicher und lesbarer!

Grüße Roman

#3

Hallo Roman.

Danke für die schnelle Hilfe.

Nur bekomme ich immer einen Error wenn ich die Seite checken lasse : Sorry! This document can not be checked.

Stelle ich Encoding auf „iso-8859-1“ bekomme ich „237 Errors und 4 warnings“
Stelle ich es auf utf-16 nur „2 Errors, 2 warning(s)“.

Was für ein Dokumententyp habe ich denn ?

#4

Hallo lordluigi13,

zuerst, hast du die Kommentare richtig gemacht, wie ich sie in VERBESSERT angegeben hatte?

-> http://www.w3.org/QA/2002/04/valid-dtd-list.html

Versuche am Anfang das <?xml version="1.0"?> wegzulassen, denn du hast kein XML, sondern HTML.

Beim nächsten Mal, wenn du einen Link hier posten willst, verwende bitte noch das http:// damit man einfach draufklicken kann und kein copy & paste braucht :wink:

-> http://www.frost-world2.org/

Grüße Roman

#5

Habe ich alles gemacht, jedoch hat sich nichts verändert.

Habe es alleine nun soweit hinbekommen dass die Seite richtig angezeigt wird.
Jedoch unten links die Buttons werden nebeneinander anstatt untereinander angezeigt.
Dort bräuchte ich nochmals hilfe.

#6

Hallo,

bin mir gerade nicht sicher, welche Buttons du meinst, aber hinter jedem Button ein
sollte das Problem lösen!

Grüße Roman

#7

Die Blauen Buttons mit der Aufschrift. „Frostworld2 Vote“ und „Frostworld2 Community“

In der style.css habe ich es so geschrieben:

#buttons {
margin-left:18px;
}
a.button {
margin-top:10px;
float:left;
background:url(„images/button.png“);
height:84px;
width:226px;
}

a.download {
background-position:top left;
}
a.download:hover {
background-position:center left;
}
a.download:active {
background-position:bottom left;
}
a.com {
background-position:top right;
}
a.com:hover {
background-position:center right;
}
a.com:active {
background-position:bottom right;
}

Die Buttons sind alle in einer png Datei:
http://imageshack.us/m/708/8932/buttonbkq.png

#8

Hallo,

in deiner HTML-Datei:


die
durch
ersetzen. Die Bezeichnung der Klassen ist nicht sehr schön, aber momentan vermutlich nebensächlich:

„button download“ => „vote“
„button com“ => „community“

Ich habe Zweifel, aber mit dem "
" solltest du „float:left;“ nicht brauchen. Probiere es mal aus.

-> http://de.selfhtml.org/css/eigenschaften/positionier…

Du kannst jeden Link auch noch in ein passendes Element verpacken, damit du dadurch einen Zeilenumbruch bekommst:

-> http://de.selfhtml.org/html/referenz/elemente.htm#bl…

Grüße Roman

#9

Hallo Roman,

Habe nun einfach mehrere
eingefügt bis es passt.

Wenn ich „float:left“ weglasse, werden die Buttons auch nichtmehr angezeigt.

Nun wird alles richtig dargestellt. Danke