zentrierte und beim zoomen mitwachsende content box

  • Hallo,

    ich habe folgendes Problem:

    ich möchte gerne nur mit css eine box machen, welche zum linken und rechten browserrand den gleichen abstand hat, oben einen abstand von 20px und unten einen abstand von 10px.
    die box soll also genau mittig sein, und beim zoomen des inhalts normal mitwachsen.

    theoretisch brauche ich einen hilfs-div mit der breite von 50% und 100% höhe. An dem sich dann die content box orientiert. also "right: -30em;" aber irgendwie komme ich nicht wirklich drauf wie es dann aussehen muss.

    vllt. kann mir jemand helfen.

    #platzhalter {
    position: absulute;
    width: 50%;
    height: 100%;
    z-index: 1;
    background-color: #aaa;
    }

    #content {
    position: absulute;
    width: 60em;
    right: -60px;
    z-index: 2;
    background-color: #ggg;
    }

    problem bei der idee ist auch die höhe. da sie sich ja eigentlich nur aus 100%-10px-20px zusammensetzt. das wäre aber das kleine problem, da ich die ränder zu not überlagern kann. aber ich verabscheue für so etwas tabellen -> kommt nicht in frage.

  • Hi,

    verabschiede dich von position:absolute, px und %

    mach es so wie hier beschrieben.

    Wenn du alle Angaben in em machst ist dein komplettes Layout beliebig skalierbar und nichts fällt auseinander.

    koslowski

    edit. wenn du nur horizontal zentrieren willst lege um alles einen div#wrapper, gib ihm eine feste Breite und zentriere ihn mit #wrapper { margin:20px auto; }