• Das Erstellen neuer Accounts wurde ausgesetzt. Bei berechtigtem Interesse bitte Kontaktaufnahme über die üblichen Wege. Beste Grüße der Admin

div passt sich dem inhalt an

T

tchibo

New member
hallo!

ihr seit meine letzte hoffnung!
meine vorigen seiten hatte ich immer mit einem overflow:auto; gemacht um den inhalt schön übersichtlich zu gestalten. jetzt möchte ich aber a uch einmal probier, dass sich der inhalt-div der textlänge anpasst und sich einfach nach unten verlängert.

also meine seiten struktur sieht ca so aus:

<html>
<head>
</head>
<body>
<div id="wrapper">
<div id="header">
</div>
<div id="content">
<div id="navi">
</div>
<div id="inhalt">
</div>
</div>
<div id="footer">
</div
</div>
</body>
</html>

derzeit arbeite ich mit owerflow:auto für den div-"inhalt".

hier die links (bei dieser seite befindet sich im content bereich zusätzlich zum navi und inhalt div auch noch ein "sponsoren" div:

mit höhenangabe vom wrapper und inhalt auf overflow:auto:
HAK Liga

ohne höhenangabe:
HAK Liga


ohne höhenangabe:
HAK Liga


hab bei den seiten ein bischen herumgespielt. about3 kommt glaub ich am ehestsen hin,aber auch nicht das wahre...

bitte um hilfe! mfg
 
#inhalt -> Dein CSS:
Code: 
#inhalt
{
 	position:relative;
 	top:0px;
	
	width:650px;
	height:350px;
	left: 200px;
}

#inhalt -> Alternatives CSS:
Code: 
#inhalt {
 	position:relative;
 	top:0px;
	width:650px;
        left: 200px;
        }
Ansonsten ist Dein CSS (wie soll ich sagen) "unorthodox".
Ich verstehe Deinen Einsatz von z-index nicht wirklich.
Z.B., wieso kriegt der body einen z-index von 1? Stelle Dir mal die Frage, ob das Sinn macht und ob das überhaupt geht.
Und so zieht sich das Ganze weiter durch...

Edit:
Achso, ich beziehe mich auf Nr. 3...

Editedit:
Komisch, bei meinem zweiten Versuch funktioniert das obige Bsp. nicht mehr, warum auch immer...
Dein CSS ist einfach grausam. Nicht persönlich gemeint, ist aber so!
 
Zuletzt bearbeitet:
Du könntest es in etwa so machen:
Code: 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de">
<head>
<title>xxx</title>
<style type="text/css">
/*<![CDATA[*/
body{text-align:center;}
#header{width:985px;height:130px;margin:0 auto;border:1px solid #000;text-align:left;}
#header_2{width:985px;height:30px;margin:0 auto;border:1px solid #000;text-align:left;}
#content{width:985px;margin:0 auto;border:1px solid #000;text-align:left;}
#navi{width:281px;border:1px solid #000;float:left;text-align:left;}
#hauptcontent{width:700px;border:1px solid #000;float:left;text-align:left;}
#footer{width:985px;height:30px;margin:0 auto;border:1px solid #000;text-align:left;}
/*]]>*/
</style>
</head>
<body>
<div id="header">header</div>
<div id="header_2">header_2</div>
<div id="content">
<div id="navi">navi<br>navi<br>navi<br>navi<br>navi<br>navi<br>navi<br>navi<br></div>
<div id="hauptcontent">Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi. Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi. Nam liber tempor cum soluta nobis eleifend option congue nihil imperdiet doming id quod mazim placerat facer possim assum. Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi. Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi. Nam liber tempor cum soluta nobis eleifend option congue nihil imperdiet doming id quod mazim placerat facer possim assum.</div>
<br style="clear:both;" />
<div id="footer">footer</div>
</body>
</html>
Ansonsten einfach mal hier gucken: intensivstation
 
Zuletzt bearbeitet:
Du musst dich einloggen oder registrieren, um hier zu antworten.
Zurück
Oben