• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

DIV automatisch vergrößern?

Status
Für weitere Antworten geschlossen.
F

flaexx

Guest
Hallo, ich hab einen DIV, und der soll sich automatisch nach unten hin anpassen, wenn der Text länger ist, als der DIV...

geht das? Soll ich meinen Code dazuschreiben?
 
Nein! Macht er eben nicht! Ich hab das auch gedacht! Aber wenn der Text zu lang ist, dann schreibt er das einfach über den Div raus!
 
WTF? ich kann erst seit ner halben woche CSS :D soll ich meinen Code mal heir reinschreiben?
 
Doctype hat nix mit CSS zu tun ;)

Versuch mal:
Code: 
div {
  height:auto;
}
Warum es so nicht geht ist mir aber auch schleierhaft. Hast du vielleicht irgendwo ne feste Höhe definiert?
 
Kann sein, das da ne menge an überflüssigem Zeug drin is, aber ich kann ncoh nicht so lange CSS! ;)


Code: 
<html>
<head>
<title>FSL-Events</title>
<meta name="author" content="ST">
</head>
<style type="text/css">
<!--
body
    {
         background-color:    #4F4F4F;
         text-decoration:    none;
         color:            #FFFFFF;
         font-style:        Verdana;
         font-size:        12px;
         }

a:link
    {
         color:            #9F9F9F;
         text-decoration:    underline;
         }

a:visited
    {
         color:            #BFBFBF;
         }

a:hover
    {
         color:            #EFEFEF;
         text-decoration:    overline;
         }

#einruecken
    {
         text-align:         center;
         font-size:        16px;
         font-weight:        bold;
         }

#einruecken2
    {
         text-align:         center;
         font-size:        16px;
         font-weight:        bold;
         }

#main
    {
         background-color:    #7F7F7F;
         position:        absolute;
         height:            380;
         width:                  924;
         left:            50;
         top:            125;
         right:            50;
         bottom:            75;
         table-layout:        auto;
         }

#mainleft
    {
         background-color:    ;
         position:        absolute;
         width:            150;
         height:            450;
         }

#mainright
    {
         background-color:    ;
         position:        absolute;
         width:            774;
         height:            450;
         left:            150;
         }

#optimized
    {
         background-color:    ;
         positon:        absolute;
         text-align:        center;
         margin-top:        575;
         margin-left:        42;
         margin-height:        24;
         width:            924;
         }

#navi
    {
         background-color:    ;
         position:        absolute;
         width:            150;
         height:            450;
         padding-left:        ;
         padding-right:        ;
         padding-top:        ;
         }

#banner
    {
         background-color:    ;
         position:        absolute;
         width:            924;
         height:            100;
         left:            50;
         top:            10;
         text-align:        center;
         }
-->
</style>
<body>
<div id="banner"><img src="logo.png" alt="" border="0"></div>
<div id="main">
<div id="mainleft">
<div id="navi">
<p id="einruecken">
Navigation</p>
<p id="einruecken2">
<a href="index.html">Home
</a>
</p>
<p id="einruecken2">
<a href="index.html">Über FSL
</a>
</p>
<p id="einruecken2">
<a href="index.html">Sound
</a>
</p>
<p id="einruecken2">
<a href="index.html">Licht
</a>
</p>
<p id="einruecken2">
<a href="index.html">Verleih
</a>
</p>
<p id="einruecken2">
<a href="index.html">Alleinunterhalter
</a>
</p>
<p id="einruecken2">
<a href="index.html">Gästebuch
</a>
</p>
<p id="einruecken2">
<a href="index.html">Partner
</a>
</p>
<p id="einruecken2">
<a href="index.html">Kontakt
</a>
</p>

</div>
</div>
<div id="mainright">
Lorem Ipsum bla bla....Lorem Ipsum bla bla....Lorem Ipsum bla bla....

</div>
</div>
<div id="optimized">
Diese Webseite ist optimiert für den Browser Mozilla Firefox und eine Auflösung von 1024x768!
</div>
</body>
</html>
 
Absolute Positionierung... ganz schlechter Anfang.

1. Möglichkeit: Du lässt es so und definierst für den betroffenen Container noch overflow:auto; - dadurch wird er zwar nicht größer, aber es erscheinen Scrollbalken wenn der Text zu lang wird.
2. (und viel bessere) Möglichkeit: Du guckst dir auf CSS 4 You - The Finest in Stylesheets mal den Bereich "Workshop" an, da gibts Anleitungen zum Layouten mit CSS.

Ich würde dir auf jeden Fall raten dich mit letzterem mal auseinanderzusetzen, das was du machst hat keine Zukunft ;)
 
Ja, ich weiß....aber das Overflow hat mir erstmal geholfen! Danke!

Kann geschlossen werden!
 
Was du falsch machst, ist eine feste Größe zu verwenden.
Lösen könntest du das mit

min-height:;
IE Hack: height:;

Ich würde dir weiterhin mal empfehlen in dein CSS Dokument auch Einheiten zu schreiben, ansonsten sind deine Eingaben eher weniger sinnvoll.
 
Zuletzt bearbeitet:
Status
Für weitere Antworten geschlossen.

Neueste Beiträge

Zurück
Oben