Ikon: Divs nebeneinander

Hallo Leute!

Ich habe mich gefragt, wie ich div "Inhalt2" neben anstatt unterhalb von "Inhalt1" anzeigen lassen kann.
Kann mir jemand weiterhelfen?
Gruss
Ikon

Hier ist der Code:

  
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"  
       "http://www.w3.org/TR/html4/strict.dtd">  
<html>  
<head>  
<title>Fixierte Navigation nur für moderne Browser</title>  
<style type="text/css">  
  body {  
    font: normal 100.01% Helvetica, Arial, sans-serif;  
    color: black; background-color: white;  
    min-width: 40em; /* Mindestbreite verhindert Anzeigefehler in modernen Browsern */  
  }  
  p {  
    margin: 3em 0 0 3em;  /* Positionierung des 'zurueck'-Links */  
  }  
  p  a {  
    color:black;  /* Farbe des 'zurueck'-Links */  
  }  
  
  html {  
    padding: 0;  
  }  
  body {  
    margin: 0; padding: 0;  
  }  
  
  #fixiert {  
    position: absolute;  
    top: 0em; left: 0em;  
    width: 100.01%;  
    background-color: white;  
    border: 1px solid silver;  
  }  
  html>body #fixiert {  /* nur fuer moderne Browser! */  
    position: fixed;  
  }  
  #fixiert img {  
    height: 2.8em;  
  }  
  
  #Inhalt1 {  
    margin-left: 1%; width: 50%; padding: 0 1em;  
    border-left: 2px ridge gray; border-top: 2px ridge gray; border-right: 2px ridge gray;  
  }  
  * #Inhalt {  /* versteckt vor Netscape 4 */  
    background-color: #ffffe0;  
  }  
  
  #Inhalt1 h2 {  
    font-size: 1.2em;  
    margin: 2em 5% 2em;  
    color: maroon;  
    border-bottom: 1px solid silver;  
  }  
  #Inhalt1 p {  
    font-size: 1em;  
    margin: 1em 0;  
  }  
  #Inhalt1 #Fusszeile {  
    font-size: 0.9em;  
    margin: 200em 0 0; padding: 0.1em;  
    text-align: center;  
    background-color: #fed; border: 1px solid silver;  
  }  
  
  
  
  
  #Inhalt2 {  
    margin-left: 5%; width: 50%; padding: 0 1em;  
    border-left: 2px ridge gray; border-top: 2px ridge gray; border-right: 2px ridge gray;  
  }  
  * #Inhalt2 {  /* versteckt vor Netscape 4 */  
    background-color: #ffffe0;  
  }  
  
  #Inhalt2 h2 {  
    font-size: 1.2em;  
    margin: 2em 5% 2em;  
    color: maroon;  
    border-bottom: 1px solid silver;  
  }  
  #Inhalt2 p {  
    font-size: 1em;  
    margin: 1em 0;  
  }  
  #Inhalt2 #Fusszeile {  
    font-size: 0.9em;  
    margin: 200em 0 0; padding: 0.1em;  
    text-align: center;  
    background-color: #fed; border: 1px solid silver;  
  }  
  
  h1 {  
 margin-left: 0em; padding: 0 1em;  
    font-size: 1.5em;  
    margin-top: 3em;  
    text-align: center;  
    background-color: #fed;  
    border: 2px ridge gray;  
    width: 100%;  
  }  
  
  #Navigation {  
    font-size: 0.83em;  
    margin: 0 0 1.2em; padding: 0;  
  }  
  #Navigation li {  
    list-style: none;  
    margin: 0; padding: 0.5em;  
  }  
  ul#Navigation a {  
    display: block;  
    padding: 0.2em;  
    font-weight: bold;  
  }  
  ul#Navigation a:link {  
    color: black; background-color: #eee;  
  }  
  ul#Navigation a:visited {  
    color: #666; background-color: #eee;  
  }  
  ul#Navigation a:hover {  
    color: black; background-color: white;  
  }  
  ul#Navigation a:active {  
    color: white; background-color: gray;  
  }  
</style>  
</head>  
<body>  
  
<div id="Scrollbereich">  <!-- erst fuer den folgenden Workaround benoetigt -->  
  <h1>Fixierte Navigation</h1>  
  
  <div id="Inhalt1">  
    <h2>1</h2>  
    <p><strong>em</strong>  
       mit einer Schriftvergrößerung.</p>  
    <p>Beachten Sie, dass der fixierte Bereich teilweise unzugänglich wird,  
       wenn die Höhe des Browserfensters sehr stark verringert  
       und/oder die Schriftgröße heraufgesetzt wird!</p>  
  
    <p id="Fusszeile">Sie haben tatsächlich bis hierhin gescrollt? ;-)</p>  
  </div>  
</div>  
  
<div id="Inhalt2">  
    <h2>2</h2>  
    <p>In diesem Beispiel ist die linke Navigation zunächst absolut positioniert  
       und wird anschließend über eine Browserweiche nur für moderne Browser fixiert.  
       Hierdurch kommt es in älteren Browsern zu keinen Fehldarstellungen und auch  
       diese setzen die erst am Ende des Quelltextes notierte Navigation nach oben.</p>  
    <p>Für dieses Beispiel ist das &quot;mehrspaltige Layout mit Kopf-  
       und Fußzeile&quot; der vorherigen Seite etwas modifiziert worden.  
       Es passt sich der Fenster- und Schriftgröße an und sogar  
       das SELFHTML-Logo 'wächst' durch die Höhenangabe in <strong>em</strong>  
       mit einer Schriftvergrößerung.</p>  
    <p>Beachten Sie, dass der fixierte Bereich teilweise unzugänglich wird,  
       wenn die Höhe des Browserfensters sehr stark verringert  
       und/oder die Schriftgröße heraufgesetzt wird!</p>  
       <p>In diesem Beispiel ist die linke Navigation zunächst absolut positioniert  
       und wird anschließend über eine Browserweiche nur für moderne Browser fixiert.  
       Hierdurch kommt es in älteren Browsern zu keinen Fehldarstellungen und auch  
       diese setzen die erst am Ende des Quelltextes notierte Navigation nach oben.</p>  
  
  
    <p id="Fusszeile">Sie haben tatsächlich bis hierhin gescrollt? ;-)</p>  
  </div>  
</div>  
  
<div id="fixiert">  <!-- verhindert auch Anzeigefehler einer fixierten ul -->  
    <a href="einfuehrung.htm">Einführung</a>   |   <a href="mehrspaltige.htm">Layouts</a>   |   <a href="fixbereiche.htm">Fixe Layouts</a>   |   <a href="navigationsleisten.htm">CSS-basierte Navigationsleisten</a>   |   <a href="browserweichen.htm">CSS-Browserweichen</a>  
</div>  
  
</body>  
</html>  

  1. Hallo,

    wie wärs mit float:left; !?

    MfG. Christoph Ludwig

    --
    Wo die Sprache aufhört, fängt die Musik an...
    Selfcode:  ie:( fl:| br:^ va:| ls:/ fo:| rl:? n4:) ss:) de:] js:) ch:{ sh:) mo:) zu:)
    Go to this
    1. wie wärs mit float:left; !?

      Gute Idee!?

      Danke

      1. Hallo,

        wie wärs mit float:left; !?
        Gute Idee!?

        was heist Gute Idee!?
        funktionierts oder funktionierts nicht? :)

        MfG. Christoph Ludwig

        --
        Wo die Sprache aufhört, fängt die Musik an...
        Selfcode:  ie:( fl:| br:^ va:| ls:/ fo:| rl:? n4:) ss:) de:] js:) ch:{ sh:) mo:) zu:)
        Go to this
        1. was heist Gute Idee!?
          funktionierts oder funktionierts nicht? :)

          Es funktioniert, sonst würde ich mich nicht bedanken ;)

          1. Hallo,

            was heist Gute Idee!?
            funktionierts oder funktionierts nicht? :)

            Es funktioniert, sonst würde ich mich nicht bedanken ;)

            ja wegen dem fragezeichen am ende ... das war mir nicht eindeutig ... aber wenns geht ist es doch gut ^^

            MfG. Christoph Ludwig

            --
            Wo die Sprache aufhört, fängt die Musik an...
            Selfcode:  ie:( fl:| br:^ va:| ls:/ fo:| rl:? n4:) ss:) de:] js:) ch:{ sh:) mo:) zu:)
            Go to this
            1. ja wegen dem fragezeichen am ende ... das war mir nicht eindeutig ... aber wenns geht ist es doch gut ^^

              Dich zu verwirren war auch das Ziel.
              Denn ich habe das Fragezeichen am Ende deines Satzes als abwertend empfunden.^^
              Lass mich doch ein Anfänger sein.

              1. Hallo,

                Dich zu verwirren war auch das Ziel.
                Denn ich habe das Fragezeichen am Ende deines Satzes als abwertend empfunden.^^
                Lass mich doch ein Anfänger sein.

                wie gemein ^^
                na klar lass ich dich anfänger sein ... wenn du das so willst ;)

                MfG. Christoph Ludwig

                --
                Wo die Sprache aufhört, fängt die Musik an...
                Selfcode:  ie:( fl:| br:^ va:| ls:/ fo:| rl:? n4:) ss:) de:] js:) ch:{ sh:) mo:) zu:)
                Go to this
                1. Gut gekontert^^
                  Ich geh dann mal sterben... ein schönes Leben noch ;)

                  1. Hallo,

                    Gut gekontert^^
                    Ich geh dann mal sterben... ein schönes Leben noch ;)

                    na wenn du das so willst möcht ich dich nicht daran hindern ^^
                    nur wenn du vorher keinem bescheid sagtst, fängst du nach ner woche an zu stinken ;)
                    denk also an die andren :)

                    MfG. Christoph Ludwig

                    --
                    Wo die Sprache aufhört, fängt die Musik an...
                    Selfcode:  ie:( fl:| br:^ va:| ls:/ fo:| rl:? n4:) ss:) de:] js:) ch:{ sh:) mo:) zu:)
                    Go to this
  2. Hi,

    Hier ist der Code:
    [code lang=css]

    und hat es einen bestimmten Grund warum du den als 'css' formatierst obwohl es sich um 'html' handelt? Dadurch wird er nicht einfacher zu lesen...
    LG Ulysses

    1. Hallo,

      Hier ist der Code:
      [code lang=css]
      und hat es einen bestimmten Grund warum du den als 'css' formatierst obwohl es sich um 'html' handelt? Dadurch wird er nicht einfacher zu lesen...

      man hätte es auch als kombi machen können:
      <html>
      <css>
      <html>

      :)
      würde es dir dann passen?

      MfG. Christoph Ludwig

      --
      Wo die Sprache aufhört, fängt die Musik an...
      Selfcode:  ie:( fl:| br:^ va:| ls:/ fo:| rl:? n4:) ss:) de:] js:) ch:{ sh:) mo:) zu:)
      Go to this
      1. Hi

        man hätte es auch als kombi machen können:
        <html>
        <css>
        <html>

        :)
        würde es dir dann passen?

        ja, natürlich! je schöner, desto besser.

        lG Ulysses

        1. Hallo,

          ja, natürlich! je schöner, desto besser.

          ja klar .. das denk ich auch, aber hier kommt es denk ich auf den inhalt an und nicht auf das aussehen nach farbe

          MfG. Christoph Ludwig

          --
          Wo die Sprache aufhört, fängt die Musik an...
          Selfcode:  ie:( fl:| br:^ va:| ls:/ fo:| rl:? n4:) ss:) de:] js:) ch:{ sh:) mo:) zu:)
          Go to this
    2. Hi,

      Hier ist der Code:
      [code lang=css]
      und hat es einen bestimmten Grund warum du den als 'css' formatierst obwohl es sich um 'html' handelt? Dadurch wird er nicht einfacher zu lesen...
      LG Ulysses

      Bei mir ist es im Crimson Editor auch auf Syntax CSS eingestellt, wodurch alles gehighlightet wird.
      In der Vorschau bei selfhtml war html alleine auch ziemlich daneben.
      Da es sich um ein CSS Problem handelte, war es in meinen Augen am sinnvollsten, CSS zu wählen

      1. Hallo,

        Bei mir ist es im Crimson Editor auch auf Syntax CSS eingestellt, wodurch alles gehighlightet wird.
        In der Vorschau bei selfhtml war html alleine auch ziemlich daneben.
        Da es sich um ein CSS Problem handelte, war es in meinen Augen am sinnvollsten, CSS zu wählen

        auf das war er ja nicht aus.
        Er wollte es gerne bunt haben.

        MfG. Christoph Ludwig

        --
        Wo die Sprache aufhört, fängt die Musik an...
        Selfcode:  ie:( fl:| br:^ va:| ls:/ fo:| rl:? n4:) ss:) de:] js:) ch:{ sh:) mo:) zu:)
        Go to this
        1. Hi,

          auf das war er ja nicht aus.
          Er wollte es gerne bunt haben.

          nein, ich wollte es kurz und leicht leserlich!
          Meine Nörgelei war aber recht unpräzise - da hast du recht.
          LG
          Ulysses

          1. Hallo,

            nein, ich wollte es kurz und leicht leserlich!
            Meine Nörgelei war aber recht unpräzise - da hast du recht.

            achso ... naja ... sei froh das er es nicht alles blau auf weis gelassen hat ^^

            MfG. Christoph Ludwig

            --
            Wo die Sprache aufhört, fängt die Musik an...
            Selfcode:  ie:( fl:| br:^ va:| ls:/ fo:| rl:? n4:) ss:) de:] js:) ch:{ sh:) mo:) zu:)
            Go to this