Grundlagen :(

[hypnoticum]

Hallo,
kann mir mal jemand einen guten link geben, wo man die Anordnung von Elementen gut erklärt bekommt? Ich stolpere immer wieder darüber, dass ich nicht weiss wie ich meine divs, inputs, etc platzieren kann.
Wenn ich z.B. einen Code im eigenen Fenster starte sieht die Platzierung so aus wie ich's haben will. versuche ich das dann in einem div unterzubringen ist wieder alles irgendwo.
Es liegt dann wohl an den übergeordneten Elementen? Mit Firebug komme ich leider auch nicht wirklich weiter.
Im Internet gibt es überall Fragen wie man dies und das hier und dort angeordnet oder ausgerichtet bekommt. Das kann doch nicht der Weg sein, jedesmal zu googlen ...

 

[Cheffchen]

Hallo,

so was richtiges kann ich leider nicht sagen ausser vergesse position für das erste oder mach mal für dich 2 verschachtelte divs und probiere einfach mal aus was passiert wenn das eine realtiv und das andere apsolute machst und dann umgedrecht.
Zum anfang ist das meistens das problem was passiert wenn ...

ansonsten selfhtml auch wenn das nicht mehr ganz uptodate ist.

Cheffchen

 

[Elroy]

Ich stolpere immer wieder darüber, dass ich nicht weiss wie ich meine divs, inputs, etc platzieren kann.

Positioniert wird in der Regel mit margin und padding.
Margin ist für die äusseren Abstande eines Elementes zuständig und padding für die inneren.

Ich nehme an die Probleme die du hast beziehen sich auf die Asolute/Relative Positionierung.

Dazu gibt es eine Seite die das sehr gut erklärt: http://www.mediaevent.de/tutorial/css-position-absolute-relative.html

Aber denk daran: Meistens reicht margin und padding völlig aus um etwas zu positionieren.

Ansonsten kann ich dir auch nur empfehlen erst einmal eine Testseite zu erstellen und ein wenig herum zu Spielen damit du siehst wie sich was auswirkt.

Gruss
Elroy

 

[hypnoticum]

Danke für eure Tips.

Ich habe gerade gemerkt, dass ich mich z.B. auch um das Clearen der Floats kümmern muss.
Ich glaube damit schonmal eine häufige Fehlerquelle beseitigen zu können.
Für den Umgang mit den Floats fehlt mir etwas das Verständniss - mir ist nicht immer ganz klar was ich mache, wenn ich diese sachen wie overflow: hidden usw übernehme und dann versuche die Snippets auf meine Bedürfnisse anzupassen.
Ist halt ein sich abwechselndes Trial and Error mit Nachlesen. Manchmal weiss ich nicht woran es hängt und denke dann es wäre vielleicht doch mal nicht schlecht sich zumindest die Grundlagen nicht nach diesem Prinzip anzueignen - deshalb die Frage.
(Galileo Openbooks finde ich meist auch sehr gut)

Gruß, Daniel

 

[Elroy]

Für den Umgang mit den Floats fehlt mir etwas das Verständniss

Damit hatte ich auch mal Probleme.
Bitte sehr: http://css-technik.de/css-examples/219_9/

Nach dem Lesen dieses Artikels sollte es zumindest mit float keine Probleme mehr geben.

Gruss
Elroy

 

[Bennyville]

Wie sieht es mit englischen Tutorials aus? Ich finde die Codecademy sehr, sehr cool!
Bei den Übungen wird der geschriebene Code auch direkt überprüft!

http://www.codecademy.com/de/tracks/web

Ganz unten gibt es ein Tutorial zu CSS Positioning. Aber wie gesagt auf Englisch.

 

[B3nnoX]

Bei codecademy muss man nur aufpassen, wenn man ein schon leerschritt zu viel hat wird es als Falsch angezeigt. Aber sonst ist die Seite wirklich empfehlenswert und nicht nur die Kurse die da offiziell angezeigt werden, sondern auch die, die andere User erstellt haben.