Demo

Probiere ClanSphere aus und teste daran herum. Demo


Antworten: 10
Seite [1]
denimator


King for a day




Herkunft: Karnabrunn
Beiträge: 306
 # Thema - 03.11.2006 um 16:53 Uhr
Mal wieder ist ein Problem aufgetaucht.

Ich habe den <div id="content"> dreimal auf meiner Page.
Wieso fängt der <div id="navright"> erst beim dritten an und nicht oben.

Wahrscheinlich darf man das ja so gar nicht machen, aber mir fällt keine bessere Lösung ein, als so wie ich es gemacht habe.
Hat jemand einen Lösungsvorschlag?


------------------
mit freundlichen Grüßen - Denimator
Inaktiv
Mr.AndersoN


Going for pro




Herkunft: Dresden
Beiträge: 529
 # Antwort: 1 - 03.11.2006 um 16:55 Uhr
Ein Link zur Page wäre nicht schlecht.

bzw. ist ID eine eindeutige zuordnung und daher nicht für mehrfach benutzung gedacht. Dafür sind dann die klassen da.


------------------
ClanSphere - professional clan care starts here
Inaktiv
|
denimator
Thread-Ersteller


King for a day




Herkunft: Karnabrunn
Beiträge: 306
 # Antwort: 2 - 03.11.2006 um 16:59 Uhr
http://www.warrock-nwo.de.vu

mit class hat das nicht funktioniert


------------------
mit freundlichen Grüßen - Denimator
Inaktiv
|
h4ze


Geekboy




Herkunft: Itzehoe
Beiträge: 1433
 # Antwort: 3 - 03.11.2006 um 17:32 Uhr
jo, ids bitte nur einmal benutzen, alles andere regeln classes.

wenn du in der #content folgendes definiert hast: float: left; dann musst du den float clearen, indem du nach #content folgendes schreibst: <div style="clear: both;"></div>


------------------
gembee.com - Upload your Life!
A Social Filesharing Network
"Wie YouTube, nur für alle Datei-Typen"
Inaktiv
|
denimator
Thread-Ersteller


King for a day




Herkunft: Karnabrunn
Beiträge: 306
 # Antwort: 4 - 03.11.2006 um 17:41 Uhr
zurzeit steht das so da, wie muss ich das denn ändern?

mehr... +-
 
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.
1. / 2. / ... 
<?php ...
<div id="content">
<a href="warrock.php" class="hover10">WarRock</a>

<a href="counter.php" class="hover11">CounterStrike</a>

<a href="fear.php" class="hover12">FearCombat</a>
</div><div id="content">
<a href="index.php?mod=joinus&action=new" class="hover6">Join us</a>
<li><a href="index.php?mod=gbook" class="hover4">Gbook</a></li>
<a href="index.php?mod=board" class="hover5">Forum</a>
<a href="index.php?mod=members" class="hover8">Member</a>
<a href="index.php?mod=files" class="hover1">Downloads</a><br>
<a href="index.php?mod=gallery" class="hover3">Gallery</a>
<a href="index.php?mod=fightus&action=new" class="hover2">Fight us</a>
<a href="index.php?mod=page&action=view&id=8" class="hover7">Ts2 Viewer</a>
<a href="index.php?mod=bxcp&action=about" class="hover9">About</a>

</div><div id="content">
<a href="uploads/rss/news.xml"><img src="http://www.feedbase.net/Images/feed-icon-16x16.jpg">RSS News Feed</a>
<div class="ticker">
{ticker:display}
</div>
        </div><div id="content">
{func:show}
<div class="unten">
Design by Denimator
</div>
    </div>


    <div id="nav-right"> 
... ?>


ich komme da auf keinen grünen Zweig


------------------
mit freundlichen Grüßen - Denimator
Inaktiv
|
h4ze


Geekboy




Herkunft: Itzehoe
Beiträge: 1433
 # Antwort: 5 - 03.11.2006 um 19:05 Uhr
die layoutrelevanten css-dateien wären auch gut zu wissen.

ansonsten erstmal #content 2mal kopieren, dann das ganze so machen:

#head {}
#content {}
#foot {}

weil man ja ids nicht doppelt einbinden soll.
und das dann in der html entsprechend ändern.


------------------
gembee.com - Upload your Life!
A Social Filesharing Network
"Wie YouTube, nur für alle Datei-Typen"
Inaktiv
|
denimator
Thread-Ersteller


King for a day




Herkunft: Karnabrunn
Beiträge: 306
 # Antwort: 6 - 04.11.2006 um 14:36 Uhr
komplettes CSS... +-


 
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.
221.
222.
223.
224.
225.
226.
227.
228.
229.
230.
231.
232.
233.
234.
235.
236.
237.
238.
239.
240.
241.
242.
243.
244.
245.
246.
247.
248.
249.
250.
251.
252.
253.
254.
255.
256.
257.
258.
259.
260.
261.
262.
263.
264.
265.
266.
267.
268.
269.
270.
271.
272.
273.
274.
275.
276.
277.
278.
279.
280.
281.
282.
283.
284.
285.
286.
287.
288.
289.
290.
291.
292.
293.
294.
295.
296.
297.
298.
299.
300.
301.
302.
303.
304.
305.
306.
307.
308.
309.
310.
311.
312.
313.
314.
315.
316.
317.
318.
319.
320.
321.
322.
323.
324.
325.
326.
327.
328.
329.
330.
331.
332.
333.
334.
335.
336.
337.
338.
339.
340.
341.
342.
343.
344.
345.
346.
347.
348.
349.
350.
351.
352.
353.
354.
355.
356.
357.
358.
359.
360.
361.
362.
363.
364.
365.
366.
367.
368.
369.
370.
371.
372.
373.
374.
375.
376.
377.
378.
379.
380.
381.
382.
383.
384.
385.
386.
387.
388.
389.
390.
391.
392.
393.
394.
395.
396.
397.
398.
399.
400.
401.
402.
403.
404.
405.
406.
407.
408.
409.
410.
411.
412.
413.
414.
415.
416.
417.
418.
419.
420.
421.
422.
423.
424.
425.
426.
427.
428.
429.
430.
431.
432.
433.
434.
435.
436.
437.
438.
439.
440.
441.
442.
443.
444.
445.
446.
447.
448.
449.
450.
451.
452.
453.
454.
455.
456.
457.
458.
459.
460.
461.
462.
463.
464.
465.
466.
467.
468.
469.
470.
471.
472.
473.
474.
475.
476.
477.
478.
479.
480.
481.
482.
483.
484.
1. / 2. / ... 
<?php 
}
body {
    background-color:#666666;
background: url('schanier.png') center 50%;  
    color:#222222;
    font-family:Verdana,Helvetica,sans-serif,monospace;
    font-size:8pt;
    margin:0px;
    text-align:center
.hover1 { 
                       text-decoration: none; 
                       border:0; 
                       padding:0; 
                          text-indent: -9999px; 
                       letter-spacing: -9999px; 
                       font-size:0; 
                       width: 120px; 
                       height:28px; 
                       background: url("button/download.png") 0 0 no-repeat;
float:left;
                }
.hover1:hover { 
float:left;
                       background-position: -120px 0;

                }
.hover2 { 
                       text-decoration: none; 
                       border:0; 
                       padding:0; 
                       text-indent: -9999px; 
                       letter-spacing: -9999px; 
                       font-size:0; 
                       width: 200px; 
                       height:28px; 
                       background: url("button/fight.png") 0 0 no-repeat;
float:left;
                }
.hover2:hover { 
float:left;
                       background-position: -200px 0;

                }
.hover3 { 
                       text-decoration: none; 
                       border:0; 
                       padding:0; 
                       text-indent: -9999px; 
                       letter-spacing: -9999px; 
                       font-size:0; 
                       width: 120px; 
                       height:28px; 
                       background: url("button/gallery.png") 0 0 no-repeat;
float:left;
                }
.hover3:hover { 
float:left;
                       background-position: -120px 0;

                }
.hover4 { 
                       text-decoration: none; 
                       border:0; 
                       padding:0; 
                       text-indent: -9999px; 
                       letter-spacing: -9999px; 
                       font-size:0; 
                       width: 120px; 
                       height:28px; 
                       background: url("button/gbook.png") 0 0 no-repeat;
float:left;
                }
.hover4:hover { 
float:left;
                       background-position: -120px 0;

                }
.hover5 { 

                       text-decoration: none; 
                       border:0; 
                       padding:0; 
                       text-indent: -9999px; 
                       letter-spacing: -9999px; 
                       font-size:0; 
                      width: 120px; 
                       height:28px; 
                       background: url("button/forum.png") 0 0 no-repeat;
float:left;
                }
.hover5:hover { 
float:left;
                       background-position: -120px 0;

                }
.hover6 { 

                       text-decoration: none; 
                       border:0; 
                       padding:0; 
                       text-indent: -9999px; 
                       letter-spacing: -9999px; 
                       font-size:0; 
                       width: 120px; 
                       height:28px; 
                       background: url("button/join.png") 0 0 no-repeat;
float:left;
                }
.hover6:hover { 
float:left;    
               background-position: -120px 0;

                }
.hover7 { 

                       text-decoration: none; 
                       border:0; 
                       padding:0; 
                       text-indent: -9999px; 
                      letter-spacing: -9999px; 
                       font-size:0; 
                      width: 120px; 
                       height:28px; 
                       background: url("button/ts2.png") 0 0 no-repeat;
float:left;
                }
.hover7:hover { 
float:left;
                       background-position: -120px 0;

                }
.hover8 { 
                       text-decoration: none; 
                       border:0; 
                       padding:0; 
                       text-indent: -9999px; 
                       letter-spacing: -9999px; 
                       font-size:0; 
                       width: 120px; 
                       height:28px; 
                       background: url("button/member.png") 0 0 no-repeat;
float:left;
                }
.hover8:hover { 
float:left;
                       background-position: -120px 0;

                }
.hover9 { 
                       text-decoration: none; 
                       border:0; 
                       padding:0; 
                       text-indent: -9999px; 
                       letter-spacing: -9999px; 
                       font-size:0; 
                       width: 160px; 
                       height:28px; 
                       background: url("button/aboutb.png") 0 0 no-repeat;
float:left;
                }
.hover9:hover { 
float:left;
                       background-position: -160px 0;

                }
.hover10 { 
                       text-decoration: none; 
                       border:0; 
                       padding:0; 
                       text-indent: -9999px; 
                       letter-spacing: -9999px; 
                       font-size:0; 
                       width: 200px; 
                       height:23px; 
                       background: url("button/wr.png") 0 0 no-repeat;
float:left;
                }
.hover10:hover { 
float:left;
                       background-position: -200px 0;

                }
.hover11 { 
                       text-decoration: none; 
                       border:0; 
                       padding:0; 
                       text-indent: -9999px; 
                       letter-spacing: -9999px; 
                       font-size:0; 
                       width: 200px; 
                   height:23px; 
                       background: url("button/cs.png") 0 0 no-repeat;
float:left;
                }
.hover11:hover { 
float:left;
                       background-position: -200px 0;

                }
.hover12 { 
                       text-decoration: none; 
                       border:0; 
                       padding:0; 
                       text-indent: -9999px; 
                       letter-spacing: -9999px; 
                       font-size:0; 
                       width: 200px; 
                       height:23px; 
                       background: url("button/fear.png") 0 0 no-repeat;
float:left;
                }
.hover12:hover { 
float:left;
                       background-position: -200px 0;

                }
.hover13 { 
                       text-decoration: none; 
                       border:0; 
                       padding:0; 
                       text-indent: -9999px; 
                       letter-spacing: -9999px; 
                       font-size:0; 
                       width: 200px; 
                       height:23px; 
                       background: url("button/allg.png") 0 0 no-repeat;
float:left;
                }
.hover13:hover { 
float:left;
                       background-position: -200px 0;

                }
a:link, a:visited {
    background-color:inherit;
    color:#000000;
    text-decoration:none;
}
a:active, a:hover {
    background-color:inherit;
    color:#FF4040;
    text-decoration:underline;
}
div, span {
    background-color:inherit;
    color:inherit;
    font-family:Verdana,Helvetica,sans-serif, monospace;
}
img {
    border:0px;
}
form {
    display:inline;
}
td {
    background-color:inherit;
    color:inherit;
    font-size:8pt;
    vertical-align:top;
}
textarea {
    width:90%;
}

#head, #nav-left, #content, #bottom {
    float:left;
    }
#head {
background: url('banner.jpg') center 50%; 
    height:194px; text-align:center; width:983px; 

}
#nav-left {
    width:140px;

}
#nav-right {
    float:right;
    width:200px;

}
#content {
    background-color:#CC0000;
border-width: 10px; border-style: groove; border-color: silver;
    color:#000000;
    text-align:left;
    width:628px;

}
#bottom {
    background-color:#CCCCCC;
    color:#000000;
    font-weight:bold;
    width:100%; padding-left:0px; padding-right:0px; padding-top:4px; padding-bottom:4px;
    text-align:center;

}
.form {
    background-color:#D8D8D8;
    border:1px solid #777777;
    color:#363636;
    font-family:Verdana,Helvetica,sans-serif;
    font-size:8pt;
    margin:2px;
    padding-left:3px;
    }

.forum {
    background-color:#CC3333;
    color:inherit;
    margin:auto;
}
.headb {
    background-color:#CC0000;
    
    color:#000000;
border:2px solid #000000;
    font-weight:bold;
    padding:4px;
    text-align:left;

}
.bottom {
    background-color:#666666;
    color:inherit;
    border:1px solid #000000;
    padding:4px 6px 4px 8px;
    text-align:center;
}
.newshead {
    background-color:#CC0000;
    border:2px solid #000000;
    color:#000000;
    font-size:8pt;
    font-weight:bold;
    text-align:left; padding-left:8px; padding-right:6px; padding-top:4px; padding-bottom:4px;
}
.left, .center, .right {
padding:1px;
}
.leftb, .centerb, .rightb {
    background-color:#CCCCCC;
    border:1px solid #000000;
    color:#000000;
    padding:4px 6px 4px 8px;
}
.leftc, .centerc, .rightc {
    background-color:#CCCCCC;
    border:1px solid #000000;
    color:inherit;
    padding:4px 6px 4px 8px;
}
.left, .leftb, .leftc {
    text-align:left;
}
.center, .centerb, .centerc {
    text-align:center;
}
.right, .rightb, .rightc {
    text-align:right;
}
.quote {
    background-color:#9B9B9B;
    border:1px solid #000000;
    color:inherit;
    padding:6px;
    text-align:left;
}
.navhead {
    background: url('oben.jpg'); no-repeat;
color:#000000;
    font-weight:bold;
    padding:6px;
    text-align:right;

}
.navhead2 {
background: url('oben.jpg'); no-repeat;
    color:#000000;
    font-weight:bold;
    padding:6px;
    text-align:right;
}
.navbodyb  {
    color:#000000;
    padding:4px 6px 4px 8px;
    text-align:left;
}
.navbodybClanInternKontakt

{
    background-color:#CCCCCC;
    background: url('button.jpg');
    color:#000000;
    text-align:left;
}
.navbodybClanInternKontakt:hover { 
color:#ffffff;
 background-position: -150px 0;
                                      
}
.navbodyb3  {
    color:#000000;
    padding:4px 6px 4px 8px;
    text-align:left;
-moz-border-radius:0px 0px 12px 12px;
}
.navbody2b {
background-color:#CCCCCC;
    color:#000000;
    padding:4px 6px 4px 8px;
    text-align:left;
}
.navbody3b {
    margin-top:10px;
    color:#000000;
    padding:4px 6px 4px 8px;
    text-align:right;
-moz-border-radius:0px 0px 12px 12px;
}
.calhead {
    background-color:#BEBEBE;
    color:inherit;
    padding:4px 2px 4px 2px;
    text-align:center;
}
.calday,.calevent,.caltoday, .calweek {
    padding:4px 2px 4px 2px;
    text-align:right;
}
.calday {
    background-color:#9B9B9B;
    color:inherit;
}
.calevent {
    background-color:#FF4040;
    color:inherit;
}
.caltoday {
    background-color:#77B2B2;
    color:inherit;
}
.calweek {
    background-color:#CDCDCD;
    color:inherit;
}
.squadspic {
    background-color:#CCCCCC;
    color:#000000; 
    padding:4px 6px 4px 8px;  
    vertical-align:middle;
}
.ticker {
background-color:#CCCCCC;
    border-left:2px solid #FFD700; border-right:2px solid #FFD700; border-top:2px #FFD700; border-bottom:2px solid #FFD700;;
    color:#000000;
    padding:6px 6px 6px 6px;
    text-align:center;
-moz-border-radius:18px 18px 18px 18px;
margin:15px;
}
.unten  {
    background-color:inherit;
    color:#FFD700;
    padding:4px 6px 4px 8px;
border-left:1px solid #FFD700; border-right:1px solid     #FFD700;  border-bottom:1px solid #FFD700; border-top:1px solid #FFD700;
margin-right:15px;margin-left:15px;margin-top:15px;margin-bottom:5px;
text-align:right;
}
.headc {
    background-color:#CCCCCC;
    color:#000000;
    font-size:8pt;;
    padding:1px;
    text-align:left;
}
.heade {
    background-color:#CCCCCC;
    color:#000000;
    font-size:8pt;
    padding:1px;
    text-align:right;
} ?>


------------------
mit freundlichen Grüßen - Denimator
Inaktiv
|
h4ze


Geekboy




Herkunft: Itzehoe
Beiträge: 1433
 # Antwort: 7 - 04.11.2006 um 15:47 Uhr
jo, füg mal jesesmal nach einer der #content ids, die du ja jez aufgeteilt hast, folgendes ein:

<div style="clear: both;"></div>


------------------
gembee.com - Upload your Life!
A Social Filesharing Network
"Wie YouTube, nur für alle Datei-Typen"
Inaktiv
|
denimator
Thread-Ersteller


King for a day




Herkunft: Karnabrunn
Beiträge: 306
 # Antwort: 8 - 04.11.2006 um 16:29 Uhr
das funktioniert leider nicht ... bzw. dann verschiebt er das ganze auch noch. ....

mehr... +-
 
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.
1. / 2. / ... 
<?php <div id="content">
<a href="warrock.php" class="hover10">WarRock</a>

<a href="counter.php" class="hover11">CounterStrike</a>

<a href="fear.php" class="hover12">FearCombat</a>
</div>
<div style="clear: both;"></div>

<div id="content">

    <a href="index.php?mod=joinus&action=new" class="hover6">Join us</a>
<li><a href="index.php?mod=gbook" class="hover4">Gbook</a></li>
<a href="index.php?mod=board" class="hover5">Forum</a>
<a href="index.php?mod=members" class="hover8">Member</a>
<a href="index.php?mod=files" class="hover1">Downloads</a><br>
<a href="index.php?mod=gallery" class="hover3">Gallery</a>
<a href="index.php?mod=fightus&action=new" class="hover2">Fight us</a>
<a href="index.php?mod=page&action=view&id=8" class="hover7">Ts2 Viewer</a>
<a href="index.php?mod=bxcp&action=about" class="hover9">About</a>
</div>
<div style="clear: both;"></div>
<div id="content">
<a href="uploads/rss/news.xml"><img src="http://www.feedbase.net/Images/feed-icon-16x16.jpg">RSS News Feed</a>
<div class="ticker">
{ticker:display}
</div>
        </div>
<div style="clear: both;"></div>
<div id="content">
{func:show}
<div class="unten">
Design by Denimator
</div>
<div style="clear: both;"></div>
    </div> ?>


------------------
mit freundlichen Grüßen - Denimator
Inaktiv
|
h4ze


Geekboy




Herkunft: Itzehoe
Beiträge: 1433
 # Antwort: 9 - 04.11.2006 um 17:52 Uhr
ist es dann schlimmer oder besser als vorher?
weil man gefloatete elemente auf jeden fall clearen sollte.


------------------
gembee.com - Upload your Life!
A Social Filesharing Network
"Wie YouTube, nur für alle Datei-Typen"
Inaktiv
|
denimator
Thread-Ersteller


King for a day




Herkunft: Karnabrunn
Beiträge: 306
 # Antwort: 10 - 04.11.2006 um 18:15 Uhr
wenn alle so ausgefüllt sind, schaut das genauso aus. Da ändert sich nichts. Wenn testweise nur eines gecleared ist, dann ist nur das erst in der mitte und der rest ist dann unten drangepickt


Das funktioniert leider immer noch nicht


------------------
mit freundlichen Grüßen - Denimator



Zuletzt editiert von denimator am 08.11.2006 um 21:57 Uhr (1x Editiert)
Inaktiv
|
Antworten: 10
Seite [1]


Sie müssen sich registrieren, um zu antworten.