Hallo zusammen,
hab unter http://www.fifty-nine.de/_stuff/css.html ne kleine Navigationsleiste gebaut. Können da mal kurz die CSS-Experten drüberschauen, ob die so "valide" ist ;)
Ein Problem hab ich noch, wo ich bislang keine Lösung gefunden habe: Die Tabelle, die sich im DIV "wrapper" befindet scheint mir breiter zu sein, als das restliche Layout mit 100%. Wie kann ich die Tabelle so breit bekommen, dass sie ausschließlich innerhalb des Wrappers bleibt???
Frohe Ostern :)
Hallo Moritz,
im IE6; WIN2000 hat`s noch einen horizontalen Scrollbalken.
Weil rechts der vertikale Scrollbalken auch angezeigt wird.
Dir fehlt ein DOCTYPE.
DOCTYPE ist das Stichwort. Jetzt klappt's im IE.
Aber beim Firefox fehlen die Buttons komplett ;(
Weil Du die nicht auf den Server geladen hast.
Statt der Fehlermeldung/Fehlerbild ignoriert der FF das.
Oder?
Hatte es bei mir lokal getestet. Die Datei ist jetzt hochgeladen. Muss ich vielleicht die Höhe der divs angeben? Aber warum klappts dann bei "infobar", wo ich keine Höhe angegeben habe?
Da würde ich eine Höhe angeben. Dann 'flattert' die Seite auch nicht so, wenn die Bilder noch nicht geladen sind.
Bei der 'infobar' spannt der Text die Höhe auf. Mit den Standardeinstellungen von padding und margin des Browsers, die Du ja nicht explizit festgelegt hast.
Die unterscheiden sich von Browser zu Browser.
Was mir bei Deinem CSS aufgefallen ist. Setzt lieber immer noch ans Ende ein Semikolon als Abschluss.
#buttons {float: right} > #buttons {float: right;}
Das ist sonst schonmal eine potentielle Fehlerquelle.
Hab alles so gemacht, wie Du gesagt hast. Und wie soll's sein: Im IE siehts genau so aus, wie ich will (z.B. die Hover-Buttons), aber im FF würgt er sich einen ab...
Tausche mal die
#butttons a {width: 100px; height: 100px; background: #ddd;}
#buttons a:hover {background: #eee;}
#buttons {float: right; width: 400px; height: 100px;}
gegen
#buttons {float: right; width: 400px; height: 100px;}
#buttons a { display: block; width: 100px; height: 100px; background-color:#fee; float: left;}
#buttons a:hover {display: block; width: 100px; height: 100px; background-color: #ee4;}
aus.
Dann klappt es. Ob das jetzt aber der Super-Code ist, weiss ich nicht.
Bin (noch) kein CSS-Experte.
;-)
Aber Experte genug, dass es jetzt hervorragend funktioniert ;-)
Ich bedanke mich recht österlich!
eher was für die pingeligen, aber mein tidy meckert noch:
[quote]
Zeile 6 Zeichen 2 - Warnung: <style> inserting "type" attribute
Zeile 37 Zeichen 41 - Warnung: <img> lacks "alt" attribute
Zeile 37 Zeichen 121 - Warnung: <img> lacks "alt" attribute
Zeile 37 Zeichen 201 - Warnung: <img> lacks "alt" attribute
Zeile 37 Zeichen 281 - Warnung: <img> lacks "alt" attribute
Zeile 38 Zeichen 17 - Warnung: <img> lacks "alt" attribute
Zeile 42 Zeichen 60 - Warnung: <a> attribute "href" lacks value
0 Fehler / 7 Warnungen
[/quote]
(aber das wolltest du bestimmt noch machen ;))
Na klar, das steht noch auf der Liste und wird asap erledigt ;-)
Seitentitel: Kurztest: valides CSS