skyliner: Problem mit div-Boxen, Webseiten-Programmierung

Hallo,

wir sollen im Informatikunterricht eine Webseite programmieren und ich bin hierbei auf mein erstes Problem gestoßen. Obwohl ich die Größe meiner div-Boxen nicht mit Prozent sondern mit px definiert habe, verändert sich die Größe je nach Inhalt. Gibt es da einen Befehl, mit dem ich das wegbekomme?

Hier nochmal meine HTML:

<div id="container">
<div id="navigation_top">
<a href="Bundesliga.html">
<img src="images/220px-Bundesliga-Logo-2010.png" alt="Zurück zur Startseite" align="left" border="0" width="200" height="100" style="margin-bottom:0px">
</a>
<h1>Die Bundesliga!</h1>
</div>

<div id="navigation_left">
<br>
<br>
<ul class="navi">
<li><a href="Tabelle.html">Tabelle</a></li>
<br> <br>
<li><a href="LetzteSpiele.html">Letzte Spiele</a></li>
<br> <br>
<li><a href="TopMannschaften.html">Top-Mannschaften</a></li>
<br> <br>
<li><a href="TopTorschützen.html">Top-Torschützen</a></li>
<br> <br>
</ul>

</div>

<p>Hallo willkommen auf der Startseite!</p>

</div>

und meine CSS-Datei:

h1 {color: white; font-family: Arial; font-size: 30pt; text-align: center; margin-top: 30px; }
h2 {color: yellow; font-family: Arial; font-size: 27pt; text-align: center; }
h3 {color: yellow; font-family: Arial; font-size: 24pt; text-align: center; }
h4 {color: yellow; font-family: Arial; font-size: 21pt; text-align: center; }
h5 {color: yellow; font-family: Arial; font-size: 18pt; text-align: center; }
h6 {color: yellow; font-family: Arial; font-size: 15pt; text-align: center; }

#container {
   background-color: #FFFFFF;
   border: 1px solid #494949;
   margin-top: auto;
   margin-left: auto;
   margin-right: auto;
   height: 1000px;
   width: 1000px;
   }

#navigation_top {
   background-color: #000000;
   height: 100px;
   width: 1000px;
   }

#navigation_left {
   background-color: #00FFFF;
   height: 900px;
   width: 200px;
   float: left;
   }

Kann mir da jemand weiterhelfen? Unter meinem eingefügten Bild, dass ich als Link zur Startseite verwenden möchte (funktioniert auch) ist immernoch ein Stück schwarzer Rand der div-Box navigation-top zu sehen.. obwohl ich die Höhe des Bildes der Höhe der Box angepasst habe.

lg skY

  1. Noch eine Frage:

    Ist es möglich, auch Inhalte (z.B. einer div-Box) per CSS zu schreiben? Also das wenn ich den Inhalt einer div-Box ändern möchte ich dies nicht über HTML mühsam auf jeder HTML-Seite ändern muss, sondern einmal per CSS?

    lg skY

    1. Hallo,

      bei deiner ersten Frage kann ich dir spontan leider nicht helfen. Aber bei der zweiten :)

      Ist es möglich, auch Inhalte (z.B. einer div-Box) per CSS zu schreiben? Also das wenn ich den Inhalt einer div-Box ändern möchte ich dies nicht über HTML mühsam auf jeder HTML-Seite ändern muss, sondern einmal per CSS?

      Es ist in css3 möglich vor/nach einem selektor (z.b. ein bestimmtes Div) einen Inhalt einzufügen aber es ist nicht möglich vorhandenen Inhalt zu ändern. CSS ist nur für den Style gedacht und kann/sollte auch nur so verwendet werden.
      wenn du nicht auf jeder Seite einzeln was ändern willst, ist es empfehlenswert mal über Includes nach zu denken (sofern ein Server vorhanden ist). ansonsten könntest du es noch über JS lösen aber auch das macht man eigentlich nicht.

      Viele Grüße,
      Tim