 |
Die letzten 5 Postings in diesem Thema » Alle anzeigen
| von onliner |
Danke! Du hast mir gerade die Augen geöffenet. Mit einem HG Bild wird alles so einfach. Danke auch für den Hinweis auf den body tag im Template. Den hatte ich völlig übersehen, da er vom Stylesheet überschrieben wird. Ist wie gesagt meine erste Div Seite  und das nächste mal mach ich ein eigenes Thema auf.
Greetings,
Onliner |
| von nisita |
hallo,
so wie du es haben willst, das geht leider nicht.. jedenfalls ist dieses problem mir schon oft untergekommen, aber es gibt nicht DIE ideale lösung...
sowas wird dann meistens so gelöst, dass das bei dir das reihe3 div ein hitnergrundbild bekommt, was in y-richtung wiederholt wird, und die anderen 3 spalten bekommen keinen hintergrund.. dadurch kann man ein 3-spalten layout so wie du es haben willst "andeuten"... -wird z.b. auch bei fast alles bloggs etc so verwendet.. um mal einen bekannten zu nenen: (http://www.justwatchthesky.com/index.asp) -dort ist auch die rechte leiste auf den inhalt so "angepasst"...
ach ja.. wenn du schon gerade noch am anfang der seite steht.. z.b. die center tags, solltest du rausmachen, genauso sowas wie '<body bgcolor="#FFFFFF" topmargin="0">' -definiere sowas doch einfach in der css datei...
und die seite, ist definitiv zu breit -würde ich so vom gefühl her sagen.. am besten wäre es, wenn du sie abhängig der breite des browsers amchen würdest, oder halt ein bisschen kleiner..
viele grüße,
nisita
PS: mache bitte beim nächsten mal ein neues topic auf, und beziehe dich z.b. per link auf diesen beitrag... das macht es einfacher.. |
| von onliner |
Hallo zusammen,
durch Zufall und auf der Suche nach einer anderen Frage bin ich auf diesem interessanten Thread gelandet. Ich habe gerade angefangen, mich mit tabellenfreiem Design zu beschäftigen und mit einiger Arbeit, der passenden Doctype Definition und einem Taschenrechner mein erstes Design gebaut. Nun habe ich ein ähnliches Problem. Ich habe in jeder Zeile mehrere Boxen mit unterschiedlichen Abständen.
Zwei Reihen oben mit jeweils zwei Boxen, dann eine Contentreihe mit Navigation rechts und Links und als Abschluss einen Footer. Mein Problem ist, dass die Navigation links und rechts neben dem Content nicht mit gestreckt wird. Ich habe versucht, meinen Code an Hand des Beispiels hier umzubauen, bin aber gescheitert :( Vielleicht habt ihr ja einen Tipp, wie die beiden Menüs mit dem Content wandern
Hier der Code:
1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
13:
14:
15:
16:
17:
18:
19:
20:
21:
22:
23:
24:
25:
26:
27:
28:
29:
30:
31:
32:
33:
34:
35:
36:
37:
38:
39:
40:
41:
42: | <!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" lang="de">
<head>
<title>meineseite.de</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<link rel="stylesheet" href="divdesign.css" type="text/css">
</head>
<body bgcolor="#FFFFFF" topmargin="0">
<div align="center">
<div id="outline">
<div id="reihe1">
<div id="obenlinks">Ich bin eine Infozeile</div>
<div id="obenrechts"></div>
</div>
<div id="reihe2">
<div id="logo"><a href="index.html" target="_top"><img src="http://www.campus-dieburg.de/asta/gruen.gif" width="602" height="77" align="center" border="0"></a></div>
<div id="shoutbox"><img src="http://www.campus-dieburg.de/asta/weiss.gif" width="300" height="77" align="center" border="0"></div>
</div>
<div id="reihe3">
<div id="menu" class="navi">Menu-L</div>
<div id="content-main">Hier ist der Inhalt, der den contentframe streckt <!--
<br /><br /><br /><br /><br /><br /><br /><br />
-->
</div>
<div id="menu-right"><center>
<img src="http://www.campus-dieburg.de/asta/gruen.gif" width="88" height="32" border="0">
<img src="http://www.campus-dieburg.de/asta/gruen.gif" width="88" height="32" border="0">
</center>
Menu-R
</div>
</div>
<div id="reihe4">
<div id="footer" class="navi">Ich bin der Footer</div>
</div>
</div>
</div>
</body>
</html> |
und hier das Stylesheet dazu...
1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
13:
14:
15:
16:
17:
18:
19:
20:
21:
22:
23:
24:
25:
26:
27:
28:
29:
30:
31:
32:
33:
34:
35:
36:
37:
38:
39:
40:
41:
42:
43:
44:
45:
46:
47:
48:
49:
50:
51:
52:
53:
54:
55:
56:
57:
58:
59:
60:
61:
62:
63:
64:
65:
66:
67:
68:
69:
70:
71:
72:
73:
74:
75:
76:
77:
78:
79:
80:
81:
82:
83:
84:
85:
86:
87:
88:
89:
90:
91:
92:
93:
94:
95:
96:
97:
98:
99:
100:
101:
102:
103:
104:
105:
106:
107:
108:
109:
110:
111:
112:
113:
114:
115:
116:
117:
118:
119:
120:
121:
122:
123:
124:
125:
126:
127:
128:
129:
130:
131:
132:
133:
134:
135:
136:
137:
138:
139:
140:
141:
142: | html {
height: 100%;
min-height: 100%;
max-height: 999%;
}
body {
margin: 0;
padding: 0;
font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
font-size: 12px;
background-color: silver;
}
#outline {
width: 912px;
height: 100%;
min-height: 600px;
max-height: 999%;
background-color: silver;
}
#reihe1 {
width: 912px;
height: 22px;
}
#obenlinks {
width: 700px;
height: 18px;
background-color: white;
border: 1px solid #313D27;
float: left;
text-align: left;
margin: 0px 0px 2px 0px;
padding: 0px 0px 0px 2px;
}
#obenrechts {
width: 200px;
height: 18px;
background-color: white;
text-align: left;
border: 1px solid #313D27;
float: right;
margin: 0px 0px 2px 2px;
padding: 0px 2px 0px 2px;
}
#reihe2 {
width: 912px;
height: 81px;
}
#logo {
width: 602px;
height: 77px;
background-color: white;
border: 1px solid #313D27;
margin: 0px 2px 2px 0px;
float: left;
}
#shoutbox {
width: 300px;
height: 77px;
background-color: white;
text-align: left;
border: 1px solid #313D27;
float: right;
margin: 0px 0px 2px 0px;
padding: 0px 2px 0px 2px;
}
#reihe3 {
width: 912px;
height: 100%;
min-height: 100%;
max-height: 999%;
}
#menu {
width: 140px;
height: 100%;
background-color: white;
min-height: 100%;
max-height: 999%;
text-align: left;
border: 1px solid #313D27;
padding: 5px 0px 0px 2px;
margin: 0px 2px 2px 0px;
float: left;
}
#content-main {
width: 648px;
height: 100%;
background-color: white;
min-height: 100%;
max-height: 999%;
text-align: left;
border: 1px solid #313D27;
padding: 5px 5px 0px 5px;
margin: 0px 2px 2px 0px;
float: left;
}
#menu-right {
width: 102px;
height: 100%;
background-color: white;
min-height: 100%;
max-height: 999%;
border: 1px solid #313D27;
padding: 5px 0px 0px 0px;
margin: 0px 0px 2px 0px;
float: right;
}
#reihe4 {
width: 912px;
height: 22px;
}
#footer {
width: 910px;
background-color: white;
height: 18px;
border: 1px solid #313D27;
margin: 2px 0px 0px 0px;
float: left;
}
div {
font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
font-size: 10px;
line-height:16px;
border-color:#313D27;
}
|
Viele Grüße,
Onliner |
| von diwie |
super! das war es. 
Vielen Dank, ich hoffe ich kann bei evtl. weiteren Problemen wieder hier anklopfen?! ;) |
| von nisita |
probiers mal mit: für #site
jedenfalls habe ich das problem jetzt nicht mehr, allerdings bin ich mir nicht ganz sicher, ob ich nicht nochwas geändert habe.. ansonsten poste ich nochmal die ganze css datei..
mfg
nisita |
|
|
|
