Timo: DIV CSS statt FRAMES

Hallo,

ich hab mich nun mal gewagt ohne Frames eine Seite zu basteln, und zwar mit DIV Containern und CSS, leider gelingt es mir nicht das es so ist wie es sein soll.

Hier mal den Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Unbenanntes Dokument</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
<!--
body,td,th {
 font-family: Geneva, "lucida sans", Arial, Helvetica, sans-serif;
 font-size: 12px;
 color: #666666;
}
body {
 background-color: #FFFFFF;
 margin-left: 0px;
 margin-right: 0px;
 margin-bottom: 0px;
}

#top {
 left: 0px;
 width: 980px;
 height: 94px;
 border: 0px;
 background-color:#003399
}

#nav {
 left: 0px;
 width: 257px;
 height: 100%;
 border: 0px;
 background-color:#FFFFFF;
}

#content {
 left: 257px;
 width: 723px;
 height: 100%;
 border: 0px;
 background-color:#CCCCCC;
 overflow: scroll;
}

#bottom {
 left: 0px;
 bottom: 10px;
 width: 980px;
 height: 179px;
 border: 0px;
 background-color:#999999;
}
-->
</style>
</head>

<body>
<div id="top">Dies ist der obere Teil </div>
<div id="nav>">01<br>02<br>03<br>04<br></div>
<div id="content"> Die UNESCO hat eine Brosch&uuml;re unter dem Titel &quot;Ethical Implications of Emerging Technologies&quot; (PDF-Datei) ver&ouml;ffentlicht, die sich mit den Folgen des Einsatzes von RFID-Chips, von biometrischen Identifikationssystemen und Location Based Services (LBS) besch&auml;ftigt. Die von amerikanischen Juristen verfasste Brosch&uuml;re wird im Rahmen des &quot;NGO Geneva Net Dialogue&quot; ver&ouml;ffentlicht, in dem Nichtregierungs-Organisationen nach dem UN-Weltgipfel f&uuml;r Informationsfreiheit und dem Internet Governance Forum ihre Ansichten vortragen k&ouml;nnen. Was in diesem Netzdialog erarbeitet wird, soll in die Aktionslinie C10 &quot;Ethische Dimensionen der Informationsgesellschaft&quot; des Genfer WSIS-Aktionsplanes einflie&szlig;en.<br>
.<br>
</div>
<div id="bottom">Dies ist der untere Teil</div>
</body>
</html>

1.
Der obere Teil (id="top") soll immer oben sein was auch funktioniert.

2.
Der mittlere Teil der aus zwei DIV Container besteht (id="nav", id="content"), soll neben einander erscheinen und nicht untereinander. Mit der ("id=nav") soll dann auch der mittlere graue Teil (id="content") mit Hilfe der nav verändert werden.

3.
Der untere Teil (id="bottom") soll immer 10px höher als der untere Browserrand kleben. Wenn man das Fenster in der Länge kleine macht, soll dann ein Scrollbalken
entstehen beim "content".

4.
Weiterhin soll man die Seite zwar in der Größe bzw in der Länge verändern können, so das der Content dann vielleicht, je nach Inhalt keine Scrollbalken mehr benötigt. Weiterhin soll eine Sperre eingebaut sein das man wenn man das Browserfenster verkleinert, dies nur bist zu einem bestimmten Masß gehen so das der "Content" nie kleiner wird als in der Höhe von 350px.

Ich habe es schon vieles ausprobiert aber leider ist es mir nicht gelungen, ich bin für jede Hilfe und Tip dankbar.

Mit freundlichen Grüßen
Timo

  1. Moin

    Der mittlere Teil der aus zwei DIV Container besteht (id="nav", id="content"), soll neben einander erscheinen und nicht untereinander.

    dafür gibt es die Eigenschaft float

    Mit der ("id=nav") soll dann auch der mittlere graue Teil (id="content") mit Hilfe der nav verändert werden.

    ???

    Weiterhin soll man die Seite zwar in der Größe bzw in der Länge verändern können, so das der Content dann vielleicht, je nach Inhalt keine Scrollbalken mehr benötigt.

    das ist eigentlich genau so üblich.

    Weiterhin soll eine Sperre eingebaut sein das man wenn man das Browserfenster verkleinert, dies nur bist zu einem bestimmten Masß gehen so das der "Content" nie kleiner wird als in der Höhe von 350px.

    dafür gibt es min-height

    Gruß
    rfb

    --
    Man kann einen Menschen nichts lehren, man kann ihm nur helfen, es selbst zu entdecken.
    (Galileo Galilei)
  2. ich hab mich nun mal gewagt ohne Frames eine Seite zu basteln, und zwar mit DIV Containern und CSS, leider gelingt es mir nicht das es so ist wie es sein soll.

    Ich kann dir nur einen Rat geben, versuch nicht eine Technik mit einer anderen zu simulieren. Nichts das es vielleicht irgendwie gehen wird, nur wirst du so nicht die Besonderheiten eines Layoutes mit CSS verstehen.

    Struppi.

    --
    Javascript ist toll (Perl auch!)