Frau Luchte: ist es zu schwer bin ich zu blöd !

hallo leute,

wenn ich unten angegebenen quelltext im ie anschaue, sieht die seite so aus wie ich möchte (drei boxen die durch css ausgerichtet sind)

hier zu sehen http://www.aad.it-pc.de/

im mozilla & opera ist die linke box zu breit und zu lang, der alte netzscape 4,x schafft es, wie erwartet, garnicht.

im archiv habe ich mir jetzt ne menge zum thema css angeschaut aber finde nicht wirklich hilfe, darum probiere ich es jetzt hier.

bitte um hilfe,komentare, links etc. damit ich es schaffe das in den browsern (ie, mozilla & operea) die seite gleich angezeigt wird.

vielen dank im vorraus

frau luchte

html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
<!--
.navi {
 background-attachment : fixed;
 height:600px;
 width:180px;
 float:left;
 padding-left : 25px;
 padding-top : 115px;
 background-color : Aqua;
}
.kopfteil {
 background-color : Olive;
 width:760px;
 height:115px;
 padding-right : 0px;
 padding-top : 20px;
 font-family : Verdana, Geneva, Arial, Helvetica, sans-serif;
 font-size : smaller;
 text-align : right;
 float:none;
}
 .inhalt {
 background-color : #F5FDAF;
 width:760px;
 height:485px;
}
-->
</style>

</head>

<body bgcolor="#FFFFFF">

<div class="navi"> Block 1</div>

<div class="kopfteil">Block 2</div>

<div class="inhalt">Block 3</div>

</body>
</html>

  1. was hälst du von einer Tabellen Lösung

    Also

    <table>
       <tr>
       <td>Block 1</td>
       <td>
          <table>
             <tr>
                <td>Block 2</td>
                <td>Block 3</td>
             </tr>
          </table>
       </td>
       </tr>
    </table>

    nur so n Vorschlag ... :-) PS: kjannst ja dann mit PHP z.B. arbeiten und dir dann andere templates dazuladen. Dann bleibts auch übersichtlich.

    1. was hälst du von einer Tabellen Lösung

      genau das will ich ja nicht, ich will von den tabellen weg hin zum css. hier gehts um eine webseite mit zielgruppe "sehbehindert".

      für die vorleseprogramme sind tabelen meist nicht geeignet.

      trotzdem danke :-)

      1. Hi,

        hier gehts um eine webseite mit zielgruppe "sehbehindert".

        dann kommt's auf Pixel doch nicht an, oder?

        Cheatah

        --
        X-Will-Answer-Email: No
        X-Please-Search-Archive-First: Absolutely Yes
        1. lol

          gut sehen kann ich schlecht, aber schlecht hören kann ich gut !

    2. nur so n Vorschlag ... :-) PS: kjannst ja dann mit PHP z.B. arbeiten und dir dann andere templates dazuladen. Dann bleibts auch übersichtlich.

      Tabellen sind unter Webgestaltern verpönt, wenn sie nicht zum Auflisten von tabellarischen Infos dienen, sondern für die Gestaltung missbraucht werden. Dafür gibt's nämlich CSS

      Heiner

      1. nur so n Vorschlag ... :-) PS: kjannst ja dann mit PHP z.B. arbeiten und dir dann andere templates dazuladen. Dann bleibts auch übersichtlich.

        Tabellen sind unter Webgestaltern verpönt, wenn sie nicht zum Auflisten von tabellarischen Infos dienen, sondern für die Gestaltung missbraucht werden. Dafür gibt's nämlich CSS

        Heiner

        hallo heiner,

        haste denn auch einen vorschlag für mich ??

        frau luchte

  2. Hallo,

    bitte um hilfe,komentare, links etc. damit ich es schaffe das in den browsern (ie, mozilla & operea) die seite gleich angezeigt wird.

    http://tantek.com/CSS/Examples/boxmodelhack.html könnte Dir weiterhelfen. Mein Tipp: Der IE zieht padding von der inneren Anzeigefläche eines Elements ab (was falsch ist), wärend Moz und Opera die Anzeigefläche gleichgross lassen und padding die Grösse des gesammten Elements verändert(was richtig ist).

    viel Erfolg + schö
    stefan

    --
    qwert
  3. Hi,

    im mozilla & opera ist die linke box zu breit und zu lang,

    lass mich raten: Sie ist 600+115 Pixel hoch und 180+25 Pixel breit. Das ist vollkommen standardkonform, im Gegensatz zum Verhalten des IE, der der Breite das Padding noch abzieht.

    Cheatah

    --
    X-Will-Answer-Email: No
    X-Please-Search-Archive-First: Absolutely Yes
    1. Hi,

      auch high,

      ok die paddings sind raus, jetzt siehts (bis auf den netscape 4,x) fast gut aus.

      ABER: wie layoute ich nun den inhalt der boxen ?

      danke erstma :-)

      1. Hi,

        ABER: wie layoute ich nun den inhalt der boxen ?

        Gegenfrage: _Warum_ layoutest Du den Inhalt der Boxen?

        Wenn's gar nicht anders geht, mit weiteren HTML-Elementen.

        Cheatah

        --
        X-Will-Answer-Email: No
        X-Please-Search-Archive-First: Absolutely Yes
        1. Gegenfrage: _Warum_ layoutest Du den Inhalt der Boxen?

          ich will es mir einfach machen !(obwohl es kompliziert scheint)

          in der .css datei sollte deshalb der innenabstand der boxen angegeben sein, damit z.b. grafiken nicht genau am rand hängen.

          wie schon gesagt isch will nicht mit tabellen oder blind-grafiken arbeiten

          1. Hi,

            ich will es mir einfach machen !(obwohl es kompliziert scheint)

            dann richte Dich nach standardkonformen Clients. Wer defekte Software einsetzt, darf sich über defekte Darstellung nicht wundern.

            wie schon gesagt isch will nicht mit tabellen oder blind-grafiken arbeiten

            Diese Wahl kann ich nur unterstützen.

            Cheatah

            --
            X-Will-Answer-Email: No
            X-Please-Search-Archive-First: Absolutely Yes
            1. dann richte Dich nach standardkonformen Clients. Wer defekte Software einsetzt, darf sich über defekte Darstellung nicht wundern.

              HÄÄÄ?

              Diese Wahl kann ich nur unterstützen.

              na immerhin

              f.l.

              1. dann richte Dich nach standardkonformen Clients. Wer defekte Software einsetzt, darf sich über defekte Darstellung nicht wundern.

                HÄÄÄ?

                Was Cheatah meinte: So ziemlich alle Browser sind defekt. [pref:t=53245&m=294691] ff.

                Was Cheatah wirklich meinte: Probier's mal mit DOCTYPE-Angabe.
                Gunnar

                --
                Good results come from experience; and experience comes from bad results.
  4. Hallo Frau Luchte,

    mein Tip zu deinem Problem ist folgender:

    Gewöhne dir unbedingt an, den "Dokumenttyp"

    z.B. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
              "http://www.w3.org/TR/html4/loose.dtd">

    mitanzugeben.

    Du wirst sehen, dass sich auch der IE (ab Version 6) z.T.
    standardkonform verhält, wenn dieser mitangegeben wurde.

    Ansonsten schaltet sich der IE in den sog. "Quirk"-Modus und
    interpretiert deine Angaben falsch und verhält sich wie ein IE 5
    der das CSS-Box-Modell von Haus aus falsch interpretiert.

    Ansonsten gilt nämlich nach wie vor:

    deine gewünschte Höhe/Breite - margin - border - padding =  deine height/width - Angabe

    Wenn deine box also 600px hoch sein soll, und du eine padding-
    Angabe von 115px machst, muß letztenendes deine height-Angabe 485px
    sein.

    Genaueres dazu und wie man auch den IE 5 zu einem korrekten
    Verhalten bringt findest du hier:
     http://www.b-spoke.de/artikel/css/basic.html

    Im übrigen gebe ich noch zu bedenken, dass du dir noch eine Lösung
    für den Fall ausdenken solltest, falls die Inhaltsbox z.B. durch
    mehr Text nach unten hin anwächst, dann ist das gesamte Layout
    auch nicht "bündig", so wie du es hier mit deiner festen Höhe ja
    vorhast.

    Ansonsten noch viel Spaß (und vor allem viel Geduld) bei deinem
    Einstieg mit CSS.

    Gruß Wolfgang

    1. für heute soll es das gewesen sein (danke für eure infos !! )

      viele grüße

      Frau Luchte