kostenloser Webspace werbefrei: lima-city


Meine Homepage in jedem Browser anders?

lima-cityForumDie eigene HomepageHTML, CSS & Javascript

  1. Autor dieses Themas

    schinkenmedia

    Kostenloser Webspace von schinkenmedia

    schinkenmedia hat kostenlosen Webspace.

    Guten Mittag liebe Community :smile:

    Ich habe ein mehr oder weniger kleines Problem. Ich erstelle meine Homepage in HTML im Firefox-Browser auf einem 24" Bildschirm.
    Bei anderen größen oder Browsern sieht die Seite leider ganz anders aus, manchmal ist die Seite zu groß und man muss erst verkleinern, und manchmal sind Buttons in anderen Browsern ganz verschoben. Wie positioniere ich nun richtig?

    Freue mich auf hilfreiche Antworten.

  2. Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!

    lima-city: Gratis werbefreier Webspace für deine eigene Homepage

  3. daswing

    Moderator Kostenloser Webspace von daswing

    daswing hat kostenlosen Webspace.

    Moin moin,
    also ich habe mir mal dein Meisterwerk angesehen. Dabei fällt mir auf das die HTML-Struktur keine Struktur ist. Wenn du dieses Layout verwendest: Oberen Teil, 3-Teiligen Mittelteil, dann baue diesen auch so auf.
    <div id="hauptseite">
           <div id="Oberteil">
           </div>
           <div id="Mittelteil">
                  <div id="links" >
                  </div>
                  <div id="mitte" >
                  </div>
                  <div id="rechts" >
                  </div>
           </div>
    </div>



    baue auch eine feste Breite rein, eine dynamische Größe verbirgt immer die Gefahr das es nicht deinen Vorstellungen entsprechend angezeigt wird. Eine gängige Größe ist ca 1000px. Auch wenn dies auf deiner Seite recht klein aussehen würde, die Hauptanzahl von Usern hat nicht große Displays. Ich habe einen 1600 * 900px Laptop-Display und ich muss sogar horizontal scrollen, sowas geht gar nicht. Also feste Größe und (mehr) [überhaupt eine] Struktur.

    mfg Stephan


    edit1: Bei den CSS-Tag's "links", "mitte", "rechts" mit "float: left;" arbeiten, falls du das nicht weißt.

    Beitrag zuletzt geändert: 23.10.2011 12:46:34 von daswing
  4. Autor dieses Themas

    schinkenmedia

    Kostenloser Webspace von schinkenmedia

    schinkenmedia hat kostenlosen Webspace.

    daswing schrieb:
    Moin moin,
    also ich habe mir mal dein Meisterwerk angesehen. Dabei fällt mir auf das die HTML-Struktur keine Struktur ist. Wenn du dieses Layout verwendest: Oberen Teil, 3-Teiligen Mittelteil, dann baue diesen auch so auf.
    <div id="hauptseite">
           <div id="Oberteil">
           </div>
           <div id="Mittelteil">
                  <div id="links" >
                  </div>
                  <div id="mitte" >
                  </div>
                  <div id="rechts" >
                  </div>
           </div>
    </div>



    baue auch eine feste Breite rein, eine dynamische Größe verbirgt immer die Gefahr das es nicht deinen Vorstellungen entsprechend angezeigt wird. Eine gängige Größe ist ca 1000px. Auch wenn dies auf deiner Seite recht klein aussehen würde, die Hauptanzahl von Usern hat nicht große Displays. Ich habe einen 1600 * 900px Laptop-Display und ich muss sogar horizontal scrollen, sowas geht gar nicht. Also feste Größe und (mehr) [überhaupt eine] Struktur.

    mfg Stephan


    edit1: Bei den CSS-Tag's "links", "mitte", "rechts" mit "float: left;" arbeiten, falls du das nicht weißt.



    Vielen Dank!

    Nun ist meine Seite zwar kleiner, allerdings an die linke Seite gequetscht, während auf der rechten Seite ein großer weißer Rand ist. Kann man einstellen, dass die Seite an sich genau in der Mitte liegt, so das links und rechts ein gleichmäßiger Rand ist?


    Beitrag zuletzt geändert: 23.10.2011 15:13:17 von schinkenmedia
  5. Kann man.
    Dein Hauptkörper, also alles was man sieht, steht vermutlich unter "body" in deinem Quelltext.

    Jetzt brauchst du dem Body nur noch sagen, dass er in der Mitte stehen muss und eine bestimmte Breite haben soll.

    Das machst du in den css so:
    body {
    text-align:center,
    max-width: XXXXpx;
    }

    und schon hast du deine Website zentriert und mit einer Maximalbreite versehen.
  6. tradingcenter

    tradingcenter hat kostenlosen Webspace.

    Lass es dir validieren mit dem W3C HTML Checker.
  7. tradingcenter schrieb:
    Lass es dir validieren mit dem W3C HTML Checker.


    Der Validator überprüft lediglich die richtige Verwendung der HTML-Tags und nicht ob eine Webseite bei unterschiedlichen Browsern und Auflösungen korrekt angezeigt wird :wink:

    @schinkenmedia: Willkommen in der Welt und den Problemen des Webdesigns :wink:

    Grundsätzlich rate ich auch dazu feste Breiten für Webseiten zu benutzen. Außerdem solltte darauf geachtet werden, bzw beachtet werden, dass nicht jeder Benutzer einen 24"-Bildschirm besitzt, sonder gerade in der heutigen Zeit auch viele Nutzer mit Netbooks, Smartphones etc online unterwegs sind, deshalb empfiehlt es sich eine nicht zu große Breite für die Webseite zu wählen.
  8. tradingcenter

    tradingcenter hat kostenlosen Webspace.

    alfr3d schrieb:
    tradingcenter schrieb:
    Lass es dir validieren mit dem W3C HTML Checker.


    Der Validator überprüft lediglich die richtige Verwendung der HTML-Tags und nicht ob eine Webseite bei unterschiedlichen Browsern und Auflösungen korrekt angezeigt wird :wink:

    @schinkenmedia: Willkommen in der Welt und den Problemen des Webdesigns :wink:

    Grundsätzlich rate ich auch dazu feste Breiten für Webseiten zu benutzen. Außerdem solltte darauf geachtet werden, bzw beachtet werden, dass nicht jeder Benutzer einen 24"-Bildschirm besitzt, sonder gerade in der heutigen Zeit auch viele Nutzer mit Netbooks, Smartphones etc online unterwegs sind, deshalb empfiehlt es sich eine nicht zu große Breite für die Webseite zu wählen.

    Oft bereiten auch gerade die falschen HTML Tags ein falsches Design. (Bestes Beispiel, den center Tag statt div-align zu benutzen)

    Um deine Webseite zu testen empfehle ich dir übrigens browsershots.org
    Dort kannst du deine Seite auf über 6 OS und über 100 Browsern testen. :-)

    MFG
  9. Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!

    lima-city: Gratis werbefreier Webspace für deine eigene Homepage

Dir gefällt dieses Thema?

Über lima-city

Login zum Webhosting ohne Werbung!