Nina: Angabe bei height im IE

Hi,

ich hoffe, ich nerve Euch nicht mit meinen dummen Fragen. Ich bin immer bemüht, alleine eine Antwort zu finden, aber das Problem ist bei mir als absolutem Amateur meistens, dass ich gar nicht weiss, wo ich anfangen muss und selbst wenn ich ein Tutorial finde, es nicht immer nachvollziehen kann...

Also, nun hab ich mich also dazu entschieden, die Seite, an der ich arbeite, Projekt mit CSS und PHP zu gestalten.

Momentan bastel ich erstmal das Layout mit CSS zusammen.

Das klappt auch mit Firefox einwandfrei, aber IE macht mir noch Probleme:

*

body
{
margin: 0;
padding:0;
}

#header
{
font-size: 12px;
width: 100%;
height: 13%;
padding-top: 1%;
background-image: url('./images/hintergrund7.jpg');
background-position: bottom;
}

#mount
{
width: 100%;
}

#left
{
float:left;
width: 13%;
height: 78%;
background-image: url('./images/hintergrund7.1.jpg');
background-position: center;
 }

#right
 {
float: right;
width: 17%;
height: 78%;
background-image: url('./images/hintergrund7.1.jpg');
background-position: center;
}

#center
{
float: left;
width: 70%;
height: 78%;
}

#bottom
{
float: left;
width: 100%;
height: 7%;
background-image: url('./images/hintergrund6.jpg');
background-position: top;
}

Das Problem im IE ist, dass die Angaben für Höhe und Hintergrundgrafiken bei left, center und right nicht umgesetzt werden:

http://rehbraten.chinchillasucht.com/test/index2.php

Habe versucht, die Angaben in px zu machen, das ändert aber nichts an meinem Problem.

Vielleicht weiss jemand was und kann mir das möglichst verständlich erklären ? (Bin ein notorischer Schlauch-Steher ;))

LG,
Nina

  1. Hallo,

    #left
    {
    float:left;
    width: 13%;
    height: 78%;
    background-image: url('./images/hintergrund7.1.jpg');
    background-position: center;
    }
    #right
    {
    float: right;
    width: 17%;
    height: 78%;
    background-image: url('./images/hintergrund7.1.jpg');
    background-position: center;
    }
    #bottom
    {
    float: left;
    width: 100%;
    height: 7%;
    background-image: url('./images/hintergrund6.jpg');
    background-position: top;
    }
    Das Problem im IE ist, dass die Angaben für Höhe und Hintergrundgrafiken bei left, center und right nicht umgesetzt werden:

    nunja, du benutzt ja nur center und top. Wie kannst du dann sagen, dass left und right nicht funktionieren?
    Und unter welchem IE hast du denn getestet?
    Wenn left oder right nicht wie gewünscht funktionieren, versuch doch einmal die Kombination "background-position: left top;" oder "background-position: right top;"

    Grüße, Matze

    1. Hi!

      Hier stehst Du aber mit auf ihrem Schlauch... Sie meint die Container mit den IDs left und right... :)

      Grad kan nich nur das hier (http://www.intensivstation.ch/templates/) als Hilfe anbieten. Spaeter vielleicht was eigenes.

      Hey... Moment... Is das nicht MEIN Schlauch auf dem Ihr steht? *Nina und Matze wegschubs* ;)

      1. Huhu,

        Hi!

        Hier stehst Du aber mit auf ihrem Schlauch... Sie meint die Container mit den IDs left und right... :)

        Hey... Moment... Is das nicht MEIN Schlauch auf dem Ihr steht? *Nina und Matze wegschubs* ;)

        Na, zumindest mal gut zu wissen, dass ich nicht alleine draufstehe :D...

        Matze, dein Vorschlag bindet zwar wenigstens mal überhaupt eine Grafik ein, aber die sieht mit dieser Version auch nicht so aus, wie sie soll *heul* - am height Problem ändert das nichts.

        Aalso, ich schlaf jetzt erstmal ne Nacht drüber und schlag mich morgen weiter damit rum. Dann schau ich mir den Link an und hoffe, dass vlt. noch jemand nen Tipp für mich hat.

        Danke schonmal für Eure Hilfe.

        LG

      2. Hallo,

        Hier stehst Du aber mit auf ihrem Schlauch... Sie meint die Container mit den IDs left und right... :)

        oh man, irgendwie passiert mir sowas in letzter Zeit zu oft, dass ich am Thema vorbei rede.

        Aber aus solchen Gründen bennent man solche Dinge auch nicht nach deren Layoutfunktion, sondern nach dessen Inhalt. Also Header, Navi, Content, Footer z.B.

        Hey... Moment... Is das nicht MEIN Schlauch auf dem Ihr steht? *Nina und Matze wegschubs* ;)

        Moment mal, der Schlauch ist offensichtlich lang genug für alle und vielleicht kommt ja auch noch jemand dazu^^

        Mein Schlauch ist dein Schlauch und dein Schlauch ist mein *SCNR

        Grüße, Matze

        1. Guten Tach ;),

          Aber aus solchen Gründen bennent man solche Dinge auch nicht nach deren Layoutfunktion, sondern nach dessen Inhalt. Also Header, Navi, Content, Footer z.B.

          So, also umbenannt. Hast ja recht :). Jetzt auf in die nächste Runde, vlt. krieg ichs noch irgendwie gelöst :D.

          LG

      3. Hi Steel,

        Hey... Moment... Is das nicht MEIN Schlauch auf dem Ihr steht? *Nina und Matze wegschubs* ;)

        "Mi Schlaucha es su Schlaucha" und "gib nicht so an mit der Laenge".    :)

        Grüße aus H im R und *SCNR*,
        Engin

        1. Hi!

          "Mi Schlaucha es su Schlaucha" und "gib nicht so an mit der Laenge".    :)

          :D Hehehe...

          Nur: Hab ich Dir nicht schonmal gesagt 'Du sollst nicht zitieren aus Deinem My-Bereich!'? (oder irgendwem anders, bestimmt hab ich mir das auch schon gesagt)

          1. Hi Steel,

            "gib nicht so an mit der Laenge"

            Nur: Hab ich Dir nicht schonmal gesagt 'Du sollst nicht zitieren aus Deinem My-Bereich!'? (oder irgendwem anders, bestimmt hab ich mir das auch schon gesagt)

            Ach ja, das Alter. :) Ist korrigiert. Ich vergesse immer, das da ein /my/ zwischen ist.

            Grüße aus H im R,
            Engin

  2. Rehi,

    soooooooo. Ich hab jetzt stundenlang alles mögliche getestet und ich krieg die Krise. Es ist einer der Momente, wo ich mit dem berühmten Hammer in den Bildschirm.... usw....

    Ich benutze gar keinen Internet Explorer *zwinker* - nur für diese HP zwangsweise zum Testen. Aber auf meinem PC ist die Version 6.0 installiert.

    Mit Mozilla sieht's perfekt aus.
    IE zeigt mir wie gesagt weder die Hintergrundgrafiken an noch macht er die Höhe so, wie ich das wohl will.

    Vlt. hab ich mich anfangs auch ein wenig unverständlich ausgedrückt:

    Header und Footer sollen eine feste Höhe haben. Diese Angaben setzt IE auch um. Menü Links (navigation), Inhalt (inhalt) und Menü rechts (right) sollen ihre Höhe an Header und Footer anpassen, so dass schlussendlich der ganze Bildschirmbereich ausgefüllt wird.

    Mit Frames sieht das so aus:

    http://rehbraten.chinchillasucht.com/index.htm

    Mit CSS soll es so aussehen, wie es Mozilla

    http://rehbraten.chinchillasucht.com/test/index2.php

    anzeigt. *seufz*

    Ich hab jetzt wirklich so ziemlich alles durchgetestet, hab die Templates in Matzes Link durchgearbeitet, um eine Lösung zu finden und auch das SelfHTML Tutorial zum dreispaltigen Layout mit CSS - ich hab's mit <p> für den Footer probiert, mit Angaben in px für navigation und rechts (vorher Prozent), aber das klappt alles nicht im IE (ich weiss schon, warum ich den nicht benutze..... *grummel*).

    Meine CSS Datei:

    *

    body
    {
    margin: 0;
    padding:0;
    }

    #header
    {
    font-size: 12px;
    width: 100%;
    height: 13%;
    padding-top: 1%;
    background-image: url('./images/hintergrund7.jpg');
    background-position: bottom;
    }

    #navigation
    {
    float:left;
    width: 130px;
    height: 78%;
    background-image: url('./images/hintergrund7.1.jpg');
    background-position: center;
     }

    #right
     {
    float: right;
    width: 138px;
    height: 78%;
    background-image: url('./images/hintergrund7.1.jpg');
    background-position: center;
    }

    #inhalt
    {
    float: left;
    width: 70%;
    height: 78%;
    }

    #footer
    {
    clear: both;
    height: 7%;
    background-image: url('./images/hintergrund6.jpg');
    background-position: top;
    }

    Meine index2.php:
    <html>
    <head>
    <link rel="stylesheet" href="./css.css" type="text/css">
    </head>

    <body>
    <div id="header">
    <table  align="center" height="0" cellspacing="0" cellpadding="0" border="0" width="100%" scrolling="no">
      <td align="center"><img src="./images/texthamburg3.jpg" alt="Die Headergrafik kann leider nicht angezeigt werden."></td>

    </table>
    </div>
    <div id="mount">
    <div id="navigation">Links</div>
    <div id="inhalt">Mitte</div>
    <div id="right">Rechts</div>
    <div id="footer">footer</div>

    </body>
    </html>

    Hat irgendjemand da draußen eine Idee für mich ? *heul*

    LG,
    Nina

    1. Hi,

      Mit CSS soll es so aussehen, wie es Mozilla

      http://rehbraten.chinchillasucht.com/test/index2.php

      anzeigt. *seufz*

      Da korrigierst du bitte erst mal die Fehler, und fuegst eine vollstaendige Doctype-Angabe ein (um den IE aus dem Quirks Mode zu holen) - *danach* kann man weitersehen. (Solange noch syntaktische Fehler vorhanden sind, geht kein vernuenftiger Mensch auf die Suche nach den Ursachen von Darstellungsfehlern.)

      MfG ChrisB

      1. Hi,

        Da korrigierst du bitte erst mal die Fehler, und fuegst eine vollstaendige Doctype-Angabe ein (um den IE aus dem Quirks Mode zu holen) - *danach* kann man weitersehen. (Solange noch syntaktische Fehler vorhanden sind, geht kein vernuenftiger Mensch auf die Suche nach den Ursachen von Darstellungsfehlern.)

        Okay, danke, hab das erledigt- wusste ich nicht (wie gesagt: Anfänger) also danke für den Hinweis.

        Gestern hab ich das ganze mit px Angaben für IE hinbekommen. Problem ist nur, dass ich eigentlich nicht für eine bestimmte Bildschirmgröße programmieren will, sondern in Prozentangaben.

        Mache ich das mit width, verschiebt mir IE "right" nach unten.

        Mache ich das mit height, ja, Problem ja schon geschildert: keine Hintergrundbilder, keine Umsetzung der Höhe.....

        LG

        1. Rehi,

          ich könnte echt schreien. Jetzt hab ich das Problem mit dem IE so gelöst:

          *
          html
          {
          padding:0px;
          margin:0px;
          height: 100%; }

          body
          {
          background-color: #FFFFFF;
          font-size: 12px;
          font-family: Verdana, Arial, SunSans-Regular, Sans-Serif;
          color:#000000;
          padding:0px;
          margin:0px;
          height: 100%; }

          #header
          {
          font-size: 12px;
          width: 100%;
          height: 15%;
          padding-top: 10px;
          background-image: url('./images/hintergrund7.jpg');
          background-position: bottom;
          }

          #navigation
           {
          float:left;
          left: 0px;
          width: 130px;
          margin: 0px;
          padding: 0px;
          height: 79%;
          background-image: url('./images/hintergrund7.1.jpg');
          background-position: center;
           }

          #right
           {
          float: right;
          right: 0px;
          width: 130px;
          margin: 0px;
          padding: 0px;
          height: 79%;
          background-image: url('./images/hintergrund7.1.jpg');
          background-position: center;
           }

          #inhalt
           {
          float:left;
          margin: 0px;
          border-left: 0px;
          border-right: 0px;
          padding: 0px;
          background-color: #ffffff;
          height: 79%;
          background-image:url(./images/back.jpg);
          background-position:center center;
          background-repeat:no-repeat;
          background-attachment:fixed;
           }

          #footer
          {
          clear:both;
          width:100%;
          height: 6%;
          background-image: url('./images/hintergrund6.jpg');
          background-position: top;
          }

          Und jetzt macht Mozilla das, was IE vorher gemacht hat, nämlich Käse....

          Wenn das so weitergeht, mach ich's doch mit Frames *grummel*....
          Wenn ich nämlich für dieses Template schon 3 Tage brauche und es es immer noch nicht hab, wie soll das dann erst mit php werden ? Ach Mensch, ich will das können...

          LG

          1. Hallo Nina,

            ich könnte echt schreien.

            ja, raus damit - manchmal befreit es wirklich. ;-)

            Jetzt hab ich das Problem mit dem IE so gelöst:

            *
            html

            Mir ist jetzt schon in mehreren Postings von dir aufgefallen, dass du dein CSS mit einem Stern '*' beginnst (und das steht auch so in deiner CSS-Ressource). Ist das Absicht? Verfolgst du einen konkreten Zweck damit?
            Ich meine, es gibt wohl den "berüchtigten" Star-html-Hack für den IE, bei dem man mit einem eigentlich sinnlosen Selektor "* html" konkret nur den IE anspricht: Eigentlich selektiert man damit ein html-Element, das sich innerhalb eines beliebigen anderen Elements befindet. Da html aber kein übergeordnetes Element hat, kann dieser Selektor nie passen. Das begreift aber der IE nicht, er tut in diesem Fall so, als wäre der Stern nicht da.
            Apropos begreifen: Begreifst du, dass du mit dem '*' am Anfang deiner CSS möglicherweise etwas ganz anderes erreichst, als du eigentlich möchtest?

            Denn mit

            *  
            html  
            {  
            padding:0px;  
            margin:0px;  
            height: 100%; }
            

            erreichst du halt, dass dieses Ruleset nur vom IE beachtet wird. Dagegen hab ich irgendwo bei dir auch schon

            *  
            body  
            {  
            ...  
            }
            

            gesehen, was zwar nicht falsch ist (body hat ja noch ein Elternelement), aber sinnlos.

            Und jetzt macht Mozilla das, was IE vorher gemacht hat, nämlich Käse...

            Vermutlich weil ihm die 100% Höhe für das html-Element fehlen. Siehe oben.

            Schönen Sonntag noch,
             Martin

            --
            F: Was ist schneller: Das Licht oder der Schall?
            A: Offensichtlich der Schall. Wenn man den Fernseher einschaltet, kommt immer erst der Ton, und dann erst das Bild.
            1. Hi Martin

              mir ist jetzt schon in mehreren Postings von dir aufgefallen, dass du dein CSS mit einem Stern '*' beginnst (und das steht auch so in deiner CSS-Ressource). Ist das Absicht? Verfolgst du einen konkreten Zweck damit?
              Ich meine, es gibt wohl den "berüchtigten" Star-html-Hack für den IE, bei dem man mit einem eigentlich sinnlosen Selektor "* html" konkret nur den IE anspricht: Eigentlich selektiert man damit ein html-Element, das sich innerhalb eines beliebigen anderen Elements befindet. Da html aber kein übergeordnetes Element hat, kann dieser Selektor nie passen. Das begreift aber der IE nicht, er tut in diesem Fall so, als wäre der Stern nicht da.
              Apropos begreifen: Begreifst du, dass du mit dem '*' am Anfang deiner CSS möglicherweise etwas ganz anderes erreichst, als du eigentlich möchtest?

              AAAalso, jetzt bitte nicht lachen *rotwerd*: Ich hab den Stern nur eingefügt, weil mein Bruder, der Informatik-Student das gesagt hat ...... *ggg*

              Vermutlich weil ihm die 100% Höhe für das html-Element fehlen. Siehe oben.

              Sooo- Stern weg und es geht TATSÄCHLICH (ich glaubs ja kaum :D)- Danke dir.

              Dir auch nen schönen Sonntag. Wenn du wüsstest, wie happy ich jetzt bin :D... Auf auf, zum nächsten Problem :).

              LG,
              Nina

              1. Rehi,

                Auf auf, zum nächsten Problem :).

                Und da isses schon:
                Wenn man die Seite mit einem größeren Bildschirm öffnet (bei mir 1024 x 768, einwandfreie Darstellung), verschieben sich "rechts" und "footer" nach unten.

                So sieht meine CSS Datei jetzt aus:

                html
                {
                padding:0px;
                margin:0px;
                height: 100%; }

                body
                {
                background-color: #FFFFFF;
                font-size: 12px;
                font-family: Verdana, Arial, SunSans-Regular, Sans-Serif;
                color:#000000;
                padding:0px;
                margin:0px;
                height: 100%;
                }

                #header
                {
                width: 100%;
                height: 11%;
                padding-top:10px;
                padding-bottom:10px;
                vertical-align:middle;
                background-image: url('./images/hintergrund7.jpg');
                background-position: bottom;
                }

                #navigation
                 {
                float:left;
                left: 0px;
                width: 15%;
                margin: 0px;
                padding: 0px;
                height: 79%;
                background-image: url('./images/hintergrund7.1.jpg');
                background-position: center;
                 }

                #right
                 {
                float: right;
                right: 0px;
                width: 15%;
                margin: 0px;
                padding: 0px;
                height: 79%;
                background-image: url('./images/hintergrund7.1.jpg');
                background-position: center;
                 }

                #inhalt
                 {
                float:left;
                margin: 0px;
                border-left: 0px;
                border-right: 0px;
                padding: 0px;
                background-color: #ffffff;
                width:70%;
                height: 79%;
                background-image:url(./images/back.jpg);
                background-position:center center;
                background-repeat:no-repeat;
                background-attachment:fixed;
                 }

                #footer
                {
                clear:both;
                width:100%;
                height: 6%;
                background-image: url('./images/hintergrund6.jpg');
                background-position: top;
                }

                #imgheader
                {
                display: block;
                margin-left: auto;
                margin-right: auto;

                }

                Woran kann das liegen ?

                Lässt sich das irgendwie beheben ?
                LG,
                Nina

                1. Hi Nina,

                  Wenn man die Seite mit einem größeren Bildschirm öffnet (bei mir 1024 x 768, einwandfreie Darstellung), verschieben sich "rechts" und "footer" nach unten.

                  Wie meinen? 1024*768 ist kein Bildschirm sondern die Auflösung.

                  #navigation
                  {
                  float:left;
                  left: 0px;
                  width: 15%;
                  }

                  Wofür eigentlich das left:0px;? Das brauchst du nicht, ich glaub nicht mal,
                  das es irgendwas bewirkt. Zumal 0"px", bei 0 kannst du dir die "px" sparen,
                  0 ist 0 sowie Jacke Hose ist.  *g

                  #right
                  {
                  float: right;
                  right: 0px;
                  width: 15%;
                  }

                  #inhalt
                  {
                  float:left;
                  width:70%;
                  }

                  Den Inhalt brauchst du nicht floaten, der braucht nichtmal eine breiten Angabe, drücke
                  inhalt einfach mittels margin:0 16%; nach innen, dann dürfte dieser
                  Fehler behoben sein, sowas ähnliches hatte ich auch ganz zu beginn meiner HTML Karriere. :-)

                  Noch ein Zwei Tipps, wenn margin oder padding 0 haben, kannst du dir Angaben wie px oder 'wai' sparen.
                  sachen wie right:0; bei gefloateten Elementen haben keinen Einfluss auf diese, das steuerst du mit margin oder padding.

                  Grüße aus H im R,
                  Engin

                  1. Hi Engin

                    Wie meinen? 1024*768 ist kein Bildschirm sondern die Auflösung.

                    Ja sorry, ich drück mich etwas unverständlich aus ;).

                    Also bei meiner Bildschirmauflösung funktioniert es inzwischen. Was nur nicht funktioniert ist das Vollbild beim IE, aber die Frage ist ja, ob das so wichtig ist.

                    Wofür eigentlich das left:0px;? Das brauchst du nicht, ich glaub nicht mal,
                    das es irgendwas bewirkt. Zumal 0"px", bei 0 kannst du dir die "px" sparen,
                    0 ist 0 sowie Jacke Hose ist.  *g

                    Rausgenommen, danke für den Hinweise ;)

                    Den Inhalt brauchst du nicht floaten, der braucht nichtmal eine breiten Angabe, drücke
                    inhalt einfach mittels margin:0 16%; nach innen, dann dürfte dieser
                    Fehler behoben sein, sowas ähnliches hatte ich auch ganz zu beginn meiner HTML Karriere. :-)

                    Das funktioniert leider nicht. Nehme ich das float raus und mache die Angaben bei margin, verschieben sich rechts und footer wieder nach unten.

                    Oder liegt das evtl. an den Angaben für "rechts" und ich brauche da right:0; doch ?

                    Wenn ich die Breitenangabe entferne (und float lasse) wird das Hintergrundbild des Inhalts nach rechts verschoben und abgeschnitten.

                    Noch ein Zwei Tipps, wenn margin oder padding 0 haben, kannst du dir Angaben wie px oder 'wai' sparen.
                    sachen wie right:0; bei gefloateten Elementen haben keinen Einfluss auf diese, das steuerst du mit margin oder padding.

                    Danke, das muss einem nur mal jemand sagen :).

                    LG,
                    Nina

                    1. Hi Nina,

                      Was nur nicht funktioniert ist das Vollbild beim IE, aber die Frage ist ja, ob das so wichtig ist.

                      Das ist Ansichts Sache, wenn du viele Besucher hast, die mit den IEs unterwegs sind, ist eine Anpassung angebracht.

                      Das funktioniert leider nicht. Nehme ich das float raus und mache die Angaben bei margin, verschieben sich rechts und footer wieder nach unten.

                      Was floatest du? Rechts und Links müssen im gefloateten Zustand bleiben (float:right; & float:left;), dann kannst du den Inhalt
                      auch reinquetschen.
                      Ich hab das auf dieser Seite auf die beschriebene Art gelöst.

                      Oder liegt das evtl. an den Angaben für "rechts" und ich brauche da right:0; doch ?

                      Nein!  :-) Probiere es doch aus, schreib statt right 'left' hin und guck, ob sich die Angabe bemerkbar macht.

                      Wenn ich die Breitenangabe entferne (und float lasse) wird das Hintergrundbild des Inhalts nach rechts verschoben und abgeschnitten.

                      Hintergrundbilder kannst du mit background-position:; positionieren.

                      Aber was anderes, geht es evtl. um die Seite, die unter deinem Namen verlinkt ist? Wenn ja,
                      solltest du die Seite erstmal validieren bevor du dich auf Fehlersuche begibst,
                      da die meisten darstellungs Fehler aus diesen resultieren.

                      Grüße aus H im R,
                      Engin

                      1. Hi Engin

                        Was floatest du? Rechts und Links müssen im gefloateten Zustand bleiben (float:right; & float:left;), dann kannst du den Inhalt
                        auch reinquetschen.
                        Ich hab das auf dieser Seite auf die beschriebene Art gelöst.

                        Mmmmhh.. also ich floate den Inhalt. Entferne ich diese Angabe, besteht das Problem mit der Verschiebung von right nach unten. So sieht meine CSS Datei aus:

                        html
                        {
                        padding:0px;
                        margin:0px;
                        height: 100%; }

                        body
                        {
                        background-color: #FFFFFF;
                        font-size: 12px;
                        font-family: Verdana, Arial, SunSans-Regular, Sans-Serif;
                        color:#000000;
                        padding:0px;
                        margin:0px;
                        height: 100%;
                        }

                        #header
                        {
                        width: 100%;
                        height: 13%;
                        padding-top:1%;
                        background-image: url('./images/hintergrund7.jpg');
                        background-position: bottom;
                        }

                        #navigation
                         {
                        float:left;
                        width: 15%;
                        margin: 0;
                        padding: 0;
                        height: 79%;
                        background-image: url('./images/hintergrund7.1.jpg');
                        background-position: center;
                         }

                        #right
                         {
                        float: right;
                        width: 15%;
                        margin: 0;
                        padding: 0;
                        height: 79%;
                        background-image: url('./images/hintergrund7.1.jpg');
                        background-position: center;
                         }

                        #inhalt
                         {
                        float:left;
                        width:70%;
                        margin: 0px;
                        border-left: 0px;
                        border-right: 0px;
                        padding: 0px;
                        background-color: #ffffff;
                        height: 79%;
                        overflow:scroll;
                        background-image:url(./images/back.jpg);
                        background-position:center center;
                        background-repeat:no-repeat;
                        background-attachment:fixed;
                         }

                        #footer
                        {
                        clear:both;
                        width:100%;
                        height: 6%;
                        background-image: url('./images/hintergrund6.jpg');
                        background-position: top;
                        }

                        Wenn ich die Breitenangabe entferne (und float lasse) wird das Hintergrundbild des Inhalts nach rechts verschoben und abgeschnitten.

                        Hintergrundbilder kannst du mit background-position:; positionieren.

                        Du siehst ja oben, dass die Angabe vorhanden ist. Aber wenn ich width:70%; entferne schneidet es das Hintergrundbild ab. Oder steh ich da jetzt wieder auf meinem berühmten Schlauch ? ;) - Wahrscheinlich :D.

                        Aber was anderes, geht es evtl. um die Seite, die unter deinem Namen verlinkt ist? Wenn ja,
                        solltest du die Seite erstmal validieren bevor du dich auf Fehlersuche begibst,
                        da die meisten darstellungs Fehler aus diesen resultieren.

                        Nein, das ist meine private Seite, die mit keinem Browser Probleme macht. Aber du hast natürlich Recht, die muss ich auch noch überarbeiten, ist die nächste Baustelle.....

                        Das woran ich arbeite ist die seit Jahren bestehende und gut besuchte Seite einer non-profit Organisation, die nur momentan auf einer Subdomain meines Webspaces liegt (http://rehbraten.chinchillasucht.com/test/index2.php), damit nicht die ganze "Szene" schon vorher weiss, wie das neue Design aussieht ;).
                        Oke, das könnte ich auch über htaccess lösen, aber so gehts auch ganz gut, und dann würde ich da wahrscheinlich auch wieder tagelang mit rummachen ;).
                        Diese Seite habe ich jedenfalls schon nach dem freundlichen Hinweis von ChrisB validiert, zumindest die index2.php (die html Unterseiten stehen ja noch nicht).

                        Ich habe noch ein weiteres Problem.

                        Der Inhalt soll ja scrollbar sein, was ich mit overflow:scroll; gelöst habe. Ich möchte aber eigentlich nur einen vertikalen und keinen horizontalen Scrollbalken haben. Geht das und wenn ja wie ? Hab im Netz nirgenswo was dazu gefunden, nur wie man Farbe etc. von Scrollbalken ändert.

                        LG,
                        Nina

                        1. Hi Nina,

                          Mmmmhh.. also ich floate den Inhalt. Entferne ich diese Angabe, besteht das Problem mit der Verschiebung von right nach unten. So sieht meine CSS Datei aus:

                            
                          #navigation  
                           {  
                          float:left;  
                          width: 15%;  
                          background-position: center;  
                           }  
                          #right  
                           {  
                          float: right;  
                          width: 15%;  
                          background-position: center;  
                           }  
                            
                          #inhalt  
                           {  
                          margin: 0 16%; /* Diese angabe und den Inhalt nicht floaten und das width darf hier nicht in diesem Block stehen */  
                          background:url(./images/back.jpg) center center no-repeat; /* das kann man abkürzen */  
                          background-attachment:fixed;  
                           }  
                          
                          

                          So dürfte es eigentlich keine Probleme geben.

                          Du siehst ja oben, dass die Angabe vorhanden ist. Aber wenn ich width:70%; entferne schneidet es das Hintergrundbild ab. Oder steh ich da jetzt wieder auf meinem berühmten Schlauch ? ;)

                          Nina? Schlauch? hmm :-)
                          wo wird denn was abgeschnitten, evtl. vergisst du die margin Angabe, ohne die margin Angabe wird der
                          Inhalt unter die #navigation geschoben.

                          auf einer Subdomain meines Webspaces liegt (http://rehbraten.chinchillasucht.com/test/index2.php), damit nicht die ganze "Szene" schon vorher weiss, wie das neue Design aussieht ;).

                          "Computer sagt Nein"  '404 Das angeforderte Dokument ist nicht vorhanden.'

                          Oke, das könnte ich auch über htaccess lösen, aber so gehts auch ganz gut, und dann würde ich da wahrscheinlich auch wieder tagelang mit rummachen ;).

                          Du hast keinen Indianer?

                          Diese Seite habe ich jedenfalls schon nach dem freundlichen Hinweis von ChrisB validiert,

                          Ja, ChrisB seine hinweise sind unbezahlbar. :-)

                          Der Inhalt soll ja scrollbar sein, was ich mit overflow:scroll; gelöst habe. Ich möchte aber eigentlich nur einen vertikalen und keinen horizontalen Scrollbalken haben.

                          Evtl. mit overflow:auto;, diese overflow Geschichte kenne ich auch nur vom hören sagen.

                          Grüße aus H im R,
                          Engin