Homepage noch ausfeilen

  • Themenstarter Themenstarter hasimaus
  • Beginndatum Beginndatum
H

hasimaus

Hallo!

Ich habe eine Homepage aus divs selbst erstellt, habe mich ziemlich reingelesen und denke, dass es einigermaßen gut geworden ist.
Hier ist die Seite:
http://one-glimpse.com/AlmaMater/homepage/home.php

Sie ist so aufgebaut, dass sie einen Header hat, darunter 4 Spalten und darunter ein Fußende.

Trotzdem habe ich nun dennoch Fragen:
1. Auf der Seite, wenn man ganz runterscrollt, schließt die Seite nicht gut ab. Der Hintergrund in den 4 Spalten ist y-repeat, aber er geht unterhalb des Fußendes noch etwas weiter. Wisst ihr, was ich meine? Ich weiß nicht warum, aber vielleicht könnt ihr mir da helfen.

2. Und dann habe ich manchmal Schwierigkeiten, neue Divs einzufügen, denen ich im Sheet dann Eigenschaften zuweise.

Eigentlich mache ich das doch so:
<div id="kasten"></div>
und ergänze dann im sheet:
#kasten {
eigenschaft;
}

Das Problem ist, dass er diesen div dann manchmal einfach nicht anerkennt... und ich weiß nicht wieso.

Ok, vielleicht kann mir erstmal jemand helfen, dass meine Aufteilung etwas professioneller ist. Ich habe das Gefühl, es manchmal sehr kompliziert gemacht zu haben.



Es wäre echt furchtbar lieb, wenn sich jemand mal damit befassen könnte...

Liebe Grüße
Miriam
 
Zuletzt bearbeitet von einem Moderator:
Für deine angesprochenen Punkte findet sich die Ursache in der clear:both-Regel, die zum Abbruch des Umflusses der vier DIV-Spaltenblöcke dient, aber im Anschluß an den Footer-Bereich zu spät erfolgt, und dort wirkungslos bleibt.

HTML:
<body>
  <div id="container">
    <div id="oben">o</div>
    <div id="kasten">
      <div id="links1">l1</div>
      <div id="links2">l2</div>
      <div id="mitte">m</div>
      <div id="rechts">r</div>
      <div style="clear: both;"></div>
    </div>
    <div id="footer">f</div>
  </div>
</body>

Mit dieser zusätzlichen CSS-Regel sollten sich etwaig übrig gebliebene Abstände im Textfluß nahtlos schliessen lassen
CSS:
#oben img, #footer img { display:block; }
 
Zuletzt bearbeitet:
Zurück