| von HoRnominatoR |
<ironie>
ja wissen die den nicht, daß dieser thread Dir gehört?
</ironie>
und ich dachte schon, man duerfe hier einfach so teilnehmen, ohne den werten herr threadersteller, der so gnaedig war, uns diese texte zu bescheren, um erlaubnis gefragt zu haben.
mal davon abgesehen ist es dir freitgestellt, mails zu erhalten oder nicht (auf gut deutsch: selbst schuld, ich hab das aus eben diesem guten grund noch nie angewaehlt) |
| von patrickpaulsen |
Ja, muss ich dir zustimmen!
Jetzt aber bitte Schluss mit dieser, eurigen Diskussion. Das ist mein Thread und ich hab wollte nicht per Mail ständig über eure Streitereien informiert werden...
>>> Offtopicforum! DANKE |
| von DukeXP |
guessme schrieb am 28.04.2004 23:46
@DukeXP
ja wissen die den nicht, daß das Internet Dir gehört? |
Schade, dass ständig irgendwelche Komiker mit völlig sinnfreien Beiträgen versuchen ernsthaft geführte Diskussionen lächerlich zu machen ...
|
| von guessme |
@DukeXP
| Leider sind in den letzten Jahren immer mehr Menschen aus dem Print-Bereich ins Weg geströmt und versuchten |
ja wissen die den nicht, daß das Internet Dir gehört?
Nur die Rechtschreibung, auf die sollten wir uns einigen.
gruss
guessme |
| von DukeXP |
Leider sind in den letzten Jahren immer mehr Menschen aus dem Print-Bereich ins Weg geströmt und versuchten verzweifelt ihre Vorstellungen auf dieses Medium zu übertragen. Die größte Stärke von HTML ist jedoch die Skalierbarkeit und die universelle Zugänglichkeit.
Egal ob man nun Tabellen / DIV-Bereiche für das Layout verwendet oder HTML-Elemente direkt formatiert: Fehlinterpretationen sind immer in irgendeinem Browser vorhanden. Viele angebliche Vorteile von Tabellen begründen sich nur in der Gewohnheit des Webmasters oder dessen Unwillen sich weiterzubilden. |
| von HoRnominatoR |
man sollte auf keinen fall tabellen benutzen.
sobald man anfaengt logisch zu denken, versteht man, dass tabellen einfach nicht dafuer da sind. zuerst kommt das korrekte markup und tabellen sind nur und ausschliesslich fuer die tabellarische zuordnung von daten gedacht - design ist zweitrangig. im normalfall braucht man auch keine tricks und kniffe, sondern einfach ein simples CSS, die grundlagen stellen die browser richtig dar, sonst einfach probieren. mit handlichkeit oder nicht hat das absolut nichts zu tun. im besten fall braucht man nichteinmal divs. |
| von patrickpaulsen |
HI
Aber kniffe und Tricks sind nicht das, was man Anwenden sollte. Anzuwenden ist doch eigentlich das, was das W3C vorgibt. Leider wird dies jedoch oft nicht von den Browsern unterstützt. Das ist schlecht, deshalb sollte man vielleicht, trotz vieler Nachteile, Tabellen nutzen, denn die funktionieren... |
| von skc.tiddy |
tabellen haben auch in den unterschiedlichen browsern macken ...bzw. es kommt zu lustigen darstellungen...genauso ist es auch mit divs ;)
divs sind halt nur handlicher... übung macht den meister und irgendwann kennt man auch hier kniffs und tricks. |
| von patrickpaulsen |
So...
Zur protokolierung... ich habe die Änderungen, wie von Sondermülli beschrieben, am obigen Quelltext vollzogen. Mozilla zeigt die Seite nun korrekt an.
Ich muss mal kurz lästern! Lyer sind zwar ein gute Sache, wie auch schon oft im Netz diskutiert. Jedoch scheinen diese aber auch an Kinderkrankenheiten zu leiden, b.z.w. die Browser haben sich anscheinend immer noch nicht auf die Neuentwicklungen des WWW angepasst. So würde ich als mein persönlich Fazit doch lieber Tabellen zum Layouten vorziehen. Zwar werde ich mich auch in Zukunft mit Layer auseinandersetzen und diese nutzen, aber wirklich empfehlen, kann man diese anscheinend nicht! |
| von patrickpaulsen |
Hallo
Erstmal noch ein ganz ganz liebes Dankeschön!
Zur besseren Übersicht, hier nochmal der Quelltext, welcher anscheinend für die Probleme mit Mozilla verantwortlich ist. (in Opera übrigens einwandfrei)
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: | <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3c.org/TR/1999/REC-html401-19991224/loose.dtd">
<link href="templates/dk_templ/css/template_css.css" rel="stylesheet" type="text/css">
<STYLE>BODY {
BACKGROUND-COLOR: #7C907E; TEXT-ALIGN: center;
}
#bg {
PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 10px; MARGIN-LEFT: auto; WIDTH: 800px; MARGIN-RIGHT: auto; PADDING-TOP: 10px; BACKGROUND-COLOR: #000000; TEXT-ALIGN: left; background-image:url(templates/dk_temp/images/trans_pix.gif);
}
#topbg {
MARGIN: 0px 0px 0px; WIDTH: 780px; height: 270px; BACKGROUND-COLOR: #fff;
}
#header {
MARGIN: 0px 0px 0px 0px; WIDTH: 780px; BACKGROUND-COLOR: #fff; background-image:url(templates/dk_temp/images/trans_pix.gif);
}
#contentinhalt {
FLOAT: left; MARGIN: 0px 0px 10px 0px; WIDTH: 200px; PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 10px; PADDING-TOP: 10px
}
#inhalt {
FLOAT: right; MARGIN: 0px 10px; WIDTH: 530px;
}
#menucontainer {
FLOAT: right; MARGIN: 0px 0px 10px 10px; WIDTH: 200px; PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 10px; PADDING-TOP: 10px;
}
#menu {
FLOAT: right; MARGIN: 0px 10px; WIDTH: 180px;
}
#footer {
CLEAR: both; MARGIN: 0px; WIDTH: 780px; height: 150px; BACKGROUND-COLOR: #FFFFFF; background-image:url(templates/dk_temp/images/footer_bg.gif);
}
#contContainer {
MARGIN: 0px 10px; WIDTH: 780px; BACKGROUND-COLOR: #E3E3E3
}
</STYLE>
<META content="MSHTML 6.00.2600.0" name=GENERATOR></HEAD>
<BODY>
<DIV id=bg>
<DIV id=contContainer>
<DIV id=topbg><img src="templates/dk_temp/images/header.jpg" width="780" height="270" border="0" usemap="#Map">
<map name="Map">
<area shape="rect" coords="402,200,452,245" href="http://www.designerkompetenz.de/index.php?option=content&task=section&id=1&Itemid=2" target="_self">
<area shape="rect" coords="345,201,387,247" href="http://www.designerkompetenz.de" target="_self">
<area shape="rect" coords="462,199,513,246" href="http://www.designerkompetenz.de/index.php?option=content&task=section&id=3&Itemid=28" target="_self">
<area shape="rect" coords="517,199,579,247" href="http://www.designerkompetenz.de/index.php?option=com_docman&Itemid=34" target="_self">
<area shape="rect" coords="634,200,689,248" href="http://www.designerkompetenz.de/index.php?option=com_weblinks&Itemid=4" target="_self">
<area shape="rect" coords="583,199,628,247" href="http://www.designerkompetenz.de/index.php?option=com_simpleboard&Itemid=26" target="_self">
<area shape="rect" coords="699,200,748,248" href="http://www.designerkompetenz.de/index.php?option=com_glossary&Itemid=42" target="_self">
</map>
</DIV>
<DIV id=header>
<?php include ("pathway.php"); ?>
</DIV>
<DIV id=contentinhalt>
<DIV id=inhalt>
<p>
<?php include ("mainbody.php"); ?>
</p>
</DIV>
</DIV>
<DIV id=menucontainer>
<DIV id=menu>
<p>
<?php mosLoadModules ( 'right' ); ?>
</p>
<p>
<?php mosLoadModules ( 'user1' ); ?>
</p>
<p>
<?php mosLoadModules ( 'user2' ); ?>
</p>
</DIV>
</DIV>
<DIV id=footer>
<p>
<?php mosLoadModules ( 'bottom' ); ?>
</p>
</DIV>
</DIV></DIV></BODY></HTML> |
Sobald ich die Änderungen und Verbesserungen ausgeführt habe, melde ich mich nochmal! |
| von sondermuelli |
| momentan wirds in mozilla/netscape immernoch zerschossen. aus #menu und #inhalt das float:right rausmachen. und vor allem dem #contentinhalt die width:550px zuweisen. mehr fällt mir spontan jetzt auch nicht ein, weil das ganze ziemlich unübersichtlich ist. |
| von patrickpaulsen |
Hallo
Wie ist denn jetzt eure Meinung, vor allem bezüglich der Programmierung??
>>> http://www.designerkompetenz.de
Das CMS hat wieder Tabellen einsetzen.
Verbesserungsvorschläge? Meinungen? |
| von patrickpaulsen |
Hallo
Ist halt alles nicht so einfach!
Designlich wird sich sicherlich noch vieles ändern, so auch der Hintergrund.
Was die Farben betrifft seh ich keine Probleme, aber auch das scheint geschmackssache zu sein.
Wie bereits gesagt, steckt hinter dem hier thematisierten Template ein CMS (Mambo Open Source). Dieses nutzt Tabellen, welche innerhalb der Div´s genutzt werden. Ich werde auch die Tabellen irgendwann auf Div´s umstellen, aber das nimmt Zeit in Anspruch. Bis dahin muss ich mich so begnügen.
Mich interessieren Div´s vorerst nur aus Interesse! |
| von MCM |
Schau dir mal die ganze Sache im Mozilla an!! Alles total verschoben!
Ansonsten:
- Design ist nicht mein Geschmack aber ok
- Vom Hintergrund fallen einem die Augen aus
- Die Flashuhrgeht genauso falsch wie meine PC Uhr, daher hat sie keinen Nutzen. Verwende doch einfach die Serverzeit (vorrausgesetzt, die geht richtig!!)
- Headerbild passt farblich und von der Stimmung her net zum Rest der Seite
- Mich wunderst wie meinen Vorredner, dass du dir soviel mühe mit CSS machst und dann dennoch fürs Design Tabellen verwendest!!
|
| von patrickpaulsen |
Hallo
zu1.) Weil ich mich einfach mal mit dem Thema auseinander setzen wollte und somit lerne. Die Tabellen innerhalb der Div´s entstehen durch das CMS. Das werde ich aber später bereinigen... hoff ich.
zu2.) Hat geklappt.... Danke
zu3.) Nein, habe ich wirklich nicht. Ich versuche mal eine entsprechende Lösung zu finden und melden mich bei Erfolg oder Mißerfolg nochmal. Danke nochmal... |
| von sondermuelli |
hm. das layout ist schwer augenkrebsverdächtig. viel zu kontratsreiche 45°-linien wo man hinschaut. das bild im header hingegen gefällt mir gut.
zu dem css:
1. ich verstehe nicht warum du dir die mühe gemacht hast, die layout-struktur mit divs und css zu machen, wenn du dann innerhalb der divs alles mit tabellen zuknallst.
2. das problem mit den wild positionierten "Submenüs und kleinen Blogs auf der rechten Seite" behebst du am besten, indem du die dinger alle ungefloatet in ein umschliessendes div reinsetzt.
3. du hast dich in keinster weise mit dem boxmodell auseinandergesetzt. deshalb wird das layout in allen browsern ausser dem ie zerschossen, weil dieser border- und padding-angaben falsch umsetzt solange er keinen doctype bekommt, der ihn in den standard-modus switcht (und das geht auch erst seit version 6). also musst du entweder versuchen auf padding-right und padding-left angaben zu verzichten (was ich in meinem beispiel getan habe) oder tanteks boxmodel-hack verwenden.
|
| von patrickpaulsen |
Hallo
So, habe fertisch....! Ah... Richtiiiiiiich.... <Spass>
>>> hier zu sehen >>> www.designerkompetenz.de
Hab aber noch ein klitze kleines Problem...
Wenn man im Menü z.B. auf News klickt, erscheint der autom. dem Inhalt angepasste "Content-Layer". Die Submenüs und kleinen Blogs auf der rechten Seite werden nun jedoch eingrückt und erscheinen somit völlig unpositioniert.
Ich müsste den Layern nun also eine absolute Positionen geben! Wie??
Um meine Frage beantworten zu können, hier der Code meiner CSS Datei mit Angaben zu den Layern.
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:
143:
144:
145:
146:
147:
148:
149:
150:
151:
152:
153:
154:
155:
156:
157:
158:
159:
160:
161:
162:
163:
164:
165:
166:
167:
168:
169:
170:
171:
172:
173:
174:
175:
176:
177:
178:
179:
180:
181:
182:
183:
184:
185:
186:
187:
188:
189:
190:
191:
192:
193:
194:
195:
196:
197:
198:
199:
200:
201:
202:
203:
204:
205:
206:
207:
208:
209:
210:
211:
212:
213:
214:
215:
216:
217:
218:
219:
220: | /* <![CDATA[ */
body {
background-color:#CCCCCC;
background-image:url(../images/bg2.gif);
text-align:center;
}
#container {
width:800px;
text-align:left;
margin-right:10px;
margin-left:10px;
background-color:#FFFFFF;
padding:10px 10px 10px 10px;
}
#bg {
width:780px;
height:250px;
text-align:right;
margin:0 0 0 0;
background-image:url(../images/header.jpg);
background-color:#FFFFFF;
padding:10px 10px 10px 10px;
}
#pfad {
width:780px;
margin:0 0 0 0;
background-color:#FFFFFF;
padding:0 0 0 10px;
}
#header {
width:780px;
height:50px;
margin:50px 10px 10px 10px;
background-color:#CCCCCC;
background-image:url(../images/head.gif);
padding:10px 10px 10px 10px;
}
#content {
width:480px;
margin:50px 10px 10px 10px;
background-color:#FFFFFF;
float:left;
background-image:url(../images/trans_pix.gif);
padding:10px 10px 10px 10px;
}
#top {
width:480px;
margin:50px 10px 10px 10px;
background-color:#FFFFFF;
float:left;
background-image:url(../images/trans_pix.gif);
padding:10px 10px 10px 10px;
}
#right {
width:150px;
margin:50px 10px 10px 10px;
float:right;
background-color:#FFFFFF;
background-image:url(../images/trans_pix.gif);
padding:10px 10px 10px 10px;
}
#user1 {
width:150px;
margin:50px 10px 10px 10px;
float:right;
background-color:#FFFFFF;
padding:10px 10px 10px 10px;
}
#footer{
width:780px;
margin:50px 0 0 0;
background-color:#FFFFFF;
clear:both;
padding:10px 10px 10px 10px;
}
#blogleft{
width:150px;
margin:50px 10px 10px 10px;
float:right;
background-color:#FFFFFF;
background-image:url(../images/trans_pix.gif);
padding:10px 10px 10px 10px;
}
#blogright{
width:150px;
margin:50px 10px 10px 10px;
float:right;
background-color:#FFFFFF;
background-image:url(../images/trans_pix.gif);
padding:10px 10px 10px 10px;
}
#contContainer {
width:780px;
margin:0 0 0 0;
background-color:#FFFFFF;
background-image:url(../images/content_bg.gif);
}
/* ]]> */
/* Links */
a {
font-size: 11px
font-family: Verdana, Arial, Helvetica, sans-serif;
color: #808080;
text-decoration: none; }
a:hover {
color: #ff6600;
text-decoration: none; }
a:active {
text-decoration:underline;
color: #000066; }
/* Table Column */
td {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 11px;
color: #333333; }
/* Horizontal Line */
HR {
background: #c0c0c0;
height:2px;
width:170px;
border: 1px inset; }
/* --Default Class Settings-- */
.articlehead {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 11px;
font-weight: bold;
color: #333333 }
.button {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-style: normal;
font-weight: bold;
font-size: 11px;
color: #000000;
border-style: solid;
border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px }
.componentHeading {
font: bold 11px Verdana, Arial, Helvetica, sans-serif;
color: #333333;
text-align: left }
.inputbox {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 11px;
font-weight: bold;
color: #666666;
background: #FFFFFF;
border: 1px solid; }
.newsarticle {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 11px;
color: #333333;
text-align: left }
.newspane {
background-color : White; }
.newspaneopen {
border : 0px ridge #DCDCDC; }
.poll {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 11px;
color: #666666;
line-height: 14px }
.popupwindow {
background-color : #FFFFFF; }
.sectiontableentry1 {
background-color : #FFFFFF; }
.sectiontableentry2 {
background-color : #EBEBEB; }
.sectiontableheader {
background-color : #999999;
color : #FFFFFF;
font-weight : bold; }
.small {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 11px;
color: #ff6600;
text-decoration: none;
font-weight: medium }
.smalldark {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 11px;
color: #000000;
font-weight: normal }
li { list-style: inside url(../images/M_images/arrow.gif) 2px;
list-style-image: url(../images/M_images/arrow.gif);
}
table.moduletable {
margin: 0px 0px 0px 0px;
width: 95%;
border-left: solid 0px #000000;
border-right: solid 0px #000000;
border-top: solid 0px #000000;
border-bottom: solid 0px #000000;
}
table.moduletable th {
font-size : 11px;
text-align: left
} |
Ps.: Würde auch gerne ein paar Meinungen zum Design etc. hören.
|
| von patrickpaulsen |
Naja...
Dahinter steckt ein CMS. Das ist auch für die Fehlermeldung verantwortlich.
Das CMS prüft ob eine Datei direkt geladen wird oder nicht.
Wenn ich nun die includes komplett in das meinige Template setze, wird Fehlermeldug angezeigt. Lade ich jedoch das CMS hoch und zeige es über das CMS an, wird es korrekt (ohne Fehlermeldung) angezeigt.
Wie auch immer... sollte hin und wieder mal eine Fehlermeldung erscheinen, ist dies mehr oder weniger miteingeplant. Gewollt ist vielleicht der falsche Ausdruck! |
| von skc.tiddy |
was machste denn da gross mit includes......reicht doch...
1:
2:
3:
4: | <?include("inc/header.php")?>
main content
main content
<?include("inc/footer.php")?> |
was kann denn da gewollte sein ....
|
| von patrickpaulsen |
Hallo
Ist mehr oder weniger gewollt. Kommt durch ein paar Änderungen an den Pfaden der Includes! |
| von skc.tiddy |
Fatal error: Call to undefined function: mosloadmodules() in /homepages/30/d67073495/htdocs/com/templates/dk_templ/index.php on line 70
naja...das ist wohl noch kein fortschritt. |
| von patrickpaulsen |
Hallo nochmal
Vielen Dank, hat geklappt. Ich gelobe Besserung 
Unter der bereits genannten URL könnt ihr übrigens die Fortschritte beobachten, wenn ihr Lust habt. Und wenn ihr mögt, könnt ihr mir auch gerne weiterhin Tips und Verbesserungsmöglichkeiten nennen.
Danke nochmal....! |
| von patrickpaulsen |
| Vielen Dank... vielleicht bringt mich das jetzt weiter! |
| von sondermuelli |
ich hab eben mal was gemacht, was hoffentlich ungefähr das ist, was du brauchst. es wäre wahrscheinlich irgendwie noch einfacher oder besser gegangen, dürfte aber ganz brauchbar sein.
>> Klick |
| von patrickpaulsen |
| Keiner ne Lösung?? |
| von patrickpaulsen |
Hallo
Danke erstmal euch beiden...
zu1: Ich benötige mehrere Divs, weil ich an bestimten Positionen verschiedene Includes einbauen will.
zu5: Tja, warum ich die eingebaut habe, weiß ich auch net...!
Hast aber Recht mit der Aussage, das ich mich noch nicht wirklich mit css beschäftigt habe.
Hab jetzt mal nach euren Anweiungen gehandelt, aber immer noch kein wirklich positives Ergebniss. Zwar passt sich der Layer nun dem Text an, aber dafür ist nun nicht mehr der gesammte Text zu sehen. |
| von sondermuelli |
du hast dich wohl noch nicht wirklich mit css beschäftigt? bei dem katastrophen-code ist es jedenfalls kein wunder, dass das nicht so klappt wie gedacht.
1. du hast sieben divs. brauchen würdest du nur eines.
2. die divs sind zwar verschachtelt, aber alle absolut positioniert. damit nimmst du sie aus dem textfluss raus --> das umschliessende div wird also auch nicht soweit wie der inhalt nach unten gestreckt.
3. funktioniert das mit der höhe 100% spätestens wenn du einen gescheiten doctype verwendest in den modernen browsern eh nicht mehr.
4. wenn du willst, dass sich das div soweit streckt wie der inhalt, dann lass die höhen angabe weg oder schreibe height:auto.
5. was soll die xml-declaration am anfang vom dokument, wenn du weder einen xhtml-doctype angibst, noch xhtml-markup verwendest? |
| von skc.tiddy |
man kann divs auch verschachteln....
oder du gibts dem div mit dem main-content nen hintergrund und ne fest breite... |
| von patrickpaulsen |
Hallo
Ich bin ja eigentlich nicht sonderlich begriffsstutzig, aber irgendwie...
Folgendes Problem:
Ich möchte gerne mehrere CSS DIV Layer 100% Höhe zuweisen, so das diese sich dem Inhalt anpassen. Aber leider schaffe ich es nur, das er die Bildschirmhöhe komplett ausfüllt. Scrolle ich nun weiter nach unten, um den restlichen Kontent zu sehen, hört der Layer auf.
Schwer zu erklären... deshalb >>> http://www.designerkompetenz.de/templates/dk_templ/index.php
Wäre über Hilfe dankbar...
---
Patrick Paulsen
================
http://www.designerkompetenz.de |
|
