HTML– und / oder CSS-Frage

Wo sind die Experten? 😀 Folgendes: 2 Identi.ca-Seiten:

Hauptseite
Suche

Ist der Unterschied zu erkennen? Der gesamte Inhalt wird im zweiten Link ein kleines Stück weiter rechts angezeigt. Das ist auf allen (Unter-) Seiten auf Identi.ca der Fall, wo gescrollt werden muss. Hat wer eine Idee, wie dies zu lösen ist?

, ,

12 Antworten zu “HTML– und / oder CSS-Frage”

  1. Martina sagt:

    schau dir mal die Body-Beschreibung der css an. Vielleicht steckt darin der Fehler, und zwar im padding-left oder margin-left.

  2. Chris sagt:

    Die Scrollleiste wird ausgeblendet, der Inhalt wandert nach links. Soweit, so schlecht.

    body {
    position: absolute;
    width: 100%;
    margin: 0;
    padding: 0;
    font-family: Verdana, sans-serif;
    font-size: 9px;
    line-height: 12px;
    min-height: 100%;
    height: 100%;
    color: #000000;
    }

  3. Chris sagt:

    Wenn ich

    min-height: 101%;

    einstelle, wird immer die Scrollbar angezeigt, das vorrangige Problem ist behoben, schön ist das aber nicht.

  4. christianK sagt:

    Es gibt ja ein paar Browser, die immer eine Scrolleiste anzeigen, bei denen tritt dieses Problem dann nicht auf … Eine verbreitete Lösung ist
    html { min-height: 100%; margin-bottom: 1px; }
    Mir ist bislang zumindest noch keine andere Lösung untergekommen.

  5. christianK sagt:

    Noch kurz eine Anmerkung, weil Du schreibst: «schön ist das aber nicht.»

    Die Lösung der meisten Probleme, die im Zusammenhang mit CSS und den verschiedenen Browserinterpretationen auftreten, sind doch nicht schön. Ich finde diese Lösung da im Verlgeich sogar schön. ^^

  6. Oliver sagt:

    Soweit mir bekannt wird html in css nur vom IE interpretiert.

  7. christianK sagt:

    @Oliver:
    Nee, nee. Funktioniert schon auch bei FF und WebKit basierten.

  8. derhans sagt:

    Hallo,

    das ganze hat mit dem body Element wenig zu tun, entscheidend ist display.css (Linie 34):

    #wrap {
    background:#FCFFF5 url(bg-header.gif) repeat-x scroll 0 0;
    margin:0 auto;
    padding:0 20px;
    width:760px;
    }

    Das margin: 0 auto; schiebt den div immer genau in die Mitte des Anzeigebereichs steht, der natürlich mit scroll-leitse woanders liegt.

    Lösungen: du könntest entweder den margin wert von #wrap fix setzen, was dann nich bei jeder auflösung gleich gut aussieht :) oder für body nen padding-left wert von ~5px einstellen. Beides is nich so dolle und außerdem bekommst du ärger mit dem hintergrundbild, da das genau mittig zentriert wird (am html element) und dann natürlich nicht mehr passt. Mein Tipp: lass es wie es is :)

  9. christianK sagt:

    @derhans:
    Hm, dass das daran liegt, dass die Mitte mit oder ohne Scrollbalken woanders liegt, war doch eh klar, oder?

    Und insofern hat das nichts mit dem display.css zu tun und auch nicht mit dem body, bzw. html Element, sondern damit, dass bspw. FF, Safari, etc. den Scrollbalken nur anzeigen, wenn die Seitenhöhe das erforderlich macht. Es ist im Grunde also kein CSS-Problem, sondern ein Browserproblem — und deshalb gibt es nicht wenige, die per customCSS ihrem Firefox beigebracht haben, immer Scrollbalken anzuzeigen.
    Die Frage ist also, wie man den Browser so «austricksen» kann.
    Und da ist dann — mit Verlaub — die 101% oder margin-bottom: 1px Lösung um einiges eleganter, als das Layout (das eben auf zentrierten Inhalt setzt) zu verändern, indem man einen festen margin-Wert für #wrap setzt oder ein padding-left einzuführen …

    P.S. Die margin-bottom: 1px ist m.E. schöner als 101%, weil das 1% deutlich mehr ist, als 1px.

  10. Chris sagt:

    Hab die HTML-Lösung mal umgesetzt.

    Danke für Eure Hilfe. :)

  11. Spunkmeyer sagt:

    Ich würde mich darum gar nicht kümmern. Es liegt doch amBrowser, wo dieser die Scrollbar einfügt. Und wenn der Browser meint, er müsse dann das Fenster kleiner machen, ist das halt sein Ding. Da passe ich doch meine Seite nicht an. Das macht doch mehr Arbeit als nötig, weil es irgendwann eh wieder andere Browser gibt, die es anders machen…

    Ausserdem fällt das eh keinem auf, ausser dem, der das Design macht. Mir als Webseitenbenutzer wäre es nicht aufgefallen!

  12. wannaberoot sagt:

    html { min-height: 100.25%; }

RSS-Feed abonnieren