nicht angemeldet
/CSS: div im div -- Größe anpassen
Hey,
ich versuche schon seit längerem (natürlich mit korrekten Auszeichnungen [z.B. Tabelle als Tabelle; nicht als Layout,...]) eine optisch schöne, valide, browserübergreifende, barrierefreie, Seite zu "bauen".
LINK: http://www.rudweb.de/test2
Ich denke ich bin meinem Ziel recht nahe, wenn da nicht...
Also ich habe zwei divs ineinander um zwei verschiedene Hintergründe in gegenüberliegenden Ecken darzustellen. Zudem kommt noch ein div, das den Inhalt umschließt (ist als Fließtext gedacht, wegen Schriftgrößen- oder Fenster/Auflösungsunabhängigkeit). Wenn ich mein Browser-Fenster auf 800x600 ziehe überlappt das "Inhaltsdiv" die Äußerdem obwohl auf 90% Höhe eingestellt. Ich dachte die 90% beziehen sich auf Elternelemente, also die umschließenden divs. Ich kapier das nicht.
Wenn ihr einmal dabei seid die Seite anzugucken, ich bin auch für "optische Kritik" offen.
Vielen Dank schonmal im Voraus.
Tschau
--
__
________ _____/ //
/ ___ // / __ //
/ // / //_/ /_/ //
/_// /___________//
__
________ _____/ //
/ ___ // / __ //
/ // / //_/ /_/ //
/_// /___________//
-
- Doctype fehlt
- title fehlt
- Der W3C-Validator sagt, es gäbe einen Fehler mit dem schließendem </head>-Tag, auch wenn ich das nicht verstehe.
- Zwei alternativ-Texte von Bildern fehlen
- href-Zuweisung fehlt viermal
- Text etwas verbessern? ;-)
- schönes Design, gute Funktionalität
- CSS-Escape für IE: w\idth, nicht w/idth
nicht schlecht, vielleicht teilweise noch überarbeiten
mfg
Genie-
Hallo "Genie"
nicht schlecht, vielleicht teilweise noch überarbeiten
Ich bin grad drüber und als ich den DOCTYPE eintragen habe und mir die Seite wieder anschaue, fuktioniert das menü nicht mehr...soll heißen es ist eine normale <ul>-Liste ohne jegliche formatierungen. Versteh ich nicht.
Tschau
--
__
________ _____/ //
/ ___ // / __ //
/ // / //_/ /_/ //
/_// /___________//-
Hat sich erledigt...war mein Fehler.
Allerdings habe ich immer noch das vorher beschriebene Problem: Das Inhalts-div überlappt die äußeren divs. Und ich versteh das nicht.
Kann mir da vielleicht jemand weiterhelfen?
Tschau--
__
________ _____/ //
/ ___ // / __ //
/ // / //_/ /_/ //
/_// /___________//-
Allerdings habe ich immer noch das vorher beschriebene Problem: Das Inhalts-div überlappt die äußeren divs. Und ich versteh das nicht.
Hallo,
wenn du für innere Container rel. Größen angibst, mußt du das zuerst für den body tun, sonst weiß der Browser ja nicht, worauf er sich beziehen soll.
Setze den Viewport mit
body {height: 95% ... 98%;
width: 95% ... 98%;
}
(... bedeutet ausprobieren.)
Und gib allen nachfolgenden Containern rel. Größenangaben. Hab ich eben für deine Seite probiert (Tipp 2) und ich denke es geht.
Tipp:- gib allen Containern + body beim Entwurf farbige Rahmen.
- nutze die Fx developer Toolbar. Dabei kannst du das CSS links ändern und siehst rechts im Browser sofort die Änderungen
Bei mir unter Windows/TechInfo findest du mein CSS-"Frameset".
Michael
-
wenn du für innere Container rel. Größen angibst, mußt du das zuerst für den body tun, sonst weiß der Browser ja nicht, worauf er sich beziehen soll.
OK habe ich getan...ändert nichts:
Hätte es gern so: (nur zur Erklärung)
<body height="100%">
<div_hintergrund1>
<div_hintergrund2>
<div_inhalt></div_inhalt>
</div_hintergrund2>
</div_hintergrund1>
</body>body : höhe 100% > div_hintergrund1 : höhe 100% > div_hintergrund2 : höhe 100% > div_inhalt : höhe 100%
nur um den body halt noch ein margin rundrum.
Tschau
--
__
________ _____/ //
/ ___ // / __ //
/ // / //_/ /_/ //
/_// /___________//
-
-
-
Hey,
ich versuche schon seit längerem (natürlich mit korrekten Auszeichnungen [z.B. Tabelle als Tabelle; nicht als Layout,...]) eine optisch schöne, valide, browserübergreifende, barrierefreie, Seite zu "bauen".Hallo,
da bist du sicher auf gutem Weg. Ich http://dr-luthardt.de/ versuche das auch hinzubekommen. Man kann vieles erreichen, aber alles Recht machen, ist in dieser Hinsicht fast unmöglich, besonders unter Einschluss des IE - wobei, dein Problem tritt im IE nicht auf. Vielleicht findest du etwas brauchbares zu in meiner TechInfo unter "Windows" auf meiner Site.
Die Links würde ich als solche kenntlich machen, nicht erst beim hovern. Und der aktive Link, also wo man gerade ist, sollte kenntlich sein.NB: Über 800 x 600 würde ich mir nicht mehr allzu viel Sorgen machen.
Hier ein paar Links zu diesem Zweck:
http://www.w3c.de/Trans/WAI/webinhalt.html
http://www.barrierefinder.de/start.asp
http://www.einfach-fuer-alle.de/artikel/bitvfueralle/
http://www.w3.org/WAI/ER/tools/complete
http://www.wat-c.org/tools/index.html
Für Firefox ist die Developer Toolbar prima.Michael