divs dynamisch vergrößern + zeilenumbruch

Diese Seite verwendet Cookies. Durch die Nutzung unserer Seite erklären Sie sich damit einverstanden, dass wir Cookies setzen. Weitere Informationen

  • divs dynamisch vergrößern + zeilenumbruch

    Hallo,

    ich habe ein div mit folgenden Eigenschaften:

    Quellcode

    1. #content {
    2. position: fixed;
    3. height: 60%;
    4. width: 601px;
    5. margin: 0 0 0 -305px;
    6. top: 339;
    7. left: 40.0%;
    8. text-align: left;
    9. padding: 0px;
    10. background-color: white;


    das würde ich gerne als "Rohling" verwenden, falls der Text allerdings größer wird, soll bitte das (der?) div sich proportional dazu wachsen.
    Wie kann ich es außerdem realisieren, dass das der Inhalt nicht aus dem Div. hinaus kommt, sondern automatisch per Zeilenumbruch "formatiert" wird?

    Eine letzte Frage hab ich auch noch: wie kann ich das o.g. Div zentrieren?


    Vielen lieben Dank!

  • Hi,

    für die Größe musst du ein wenig tricksen.
    Der IE kennt "height" als fixe und variable größe an, aber der Firefox, opera etc. erkennt "height" nur als fix an. Dort gibt es dann "min-height".

    Die beiden Slashes dienen dazu, dass dieser Befehl nur vom IE interpretiert wird. Alle anderen Browser ignorieren das.

    Quellcode

    1. #content {
    2. min-height:60%;
    3. //height:60%;
    4. ...

    (siehe auch [google]CSS Hacks IE[/google])



    Für die mittige positionierung des div´s musst du auch wieder 2 Dinge tun.
    Für den IE reicht text-align aus. Für andere Browser musst du margin nutzen, wobei du das dann doppelt verschachteln musst.

    Quellcode

    1. #content {
    2. text-align:center;
    3. ....


    Quellcode

    1. <div style="margin:auto auto;">
    2. <div id="content">
    3. Ich bin mittig !
    4. </div>
    5. </div>