HTH-C.com - Forum
Latest News Latest Threads
Neuerung: Persönliche Galerie
Informationen zur Übernahme der Erweite..
HTH Blog - Version 2.0
#HTH.Systems - Betatester gesucht
Neueröffnung - PHPKit-Award.de
HTH Webchat v3
Letzter Beitrag Happy Birthday Bottyline Weiblicher Benutzer Heute, 0:00 Zeit der letzten Antwort
Letzter Beitrag PHPKit 1.6.6 Treffnix Männlicher Benutzer 14.03.2024 - 06:20 Zeit der letzten Antwort
Letzter Beitrag Gibt es eigentlich noch jemand der PHPki.. Treffnix Männlicher Benutzer 14.03.2024 - 06:19 Zeit der letzten Antwort
Letzter Beitrag Herzlich Willkommen Botty Männlicher Benutzer 22.02.2024 - 13:50 Zeit der letzten Antwort
Letzter Beitrag PHPKit 1.6.6 ohne ASCE auf PHP8x Myrddin Männlicher Benutzer 22.03.2023 - 13:36 Zeit der letzten Antwort
 53.527 Posts & 4.945 Themen in 78 Foren
Forenübersicht » Support / Hilfe » PHPKit 1.6.03 & 1.6.1 » Support » div funktioniert nicht mit tab..

div funktioniert nicht mit table drin
20 Beiträge in diesem Thema
 Seiten (2):    1     2    Next    >  
04.01.2009 - 09:29 Uhr
Beitrag: #1
Also ich habe das Problem, dass ich die Community-Navigation in ein div reinpacken muss. Diese ist aber aus einer table und verrutscht irgentwie immer nach unten in eine eigene Zeile.




1
2

Quellcode

<div id="header_pic"><div id="search"></div><div id="searchform">hier soll naviagtion mit $top_navigation hin</div>
</
div>


wenn nur z.b etxt da drin steht sieht noch alles richtig aus. doch sobal ich $top_navigation einfüge wirds zerissen.

hat jemand einen lösungsvorschlag? liegt eindeutig an der table, weil auch wenn ich da nur table mit text drienpacke entsteht genau das selbe Problem...

 
Zum Anfang der Seite
04.01.2009 - 13:25 Uhr
Beitrag: #2
Div und Tabellen sind regelrecht Boxen. Wenn du einen Text und dahinter eine Box haben willst, wird die Box ohne bestimmte Einstellungen unterhalb des Text angezeigt.

Mit float: right kannst du z.B. die Tabelle rechts-bündig zum Text positionieren.
Code wäre so:




1

PHP-Quelltext

#searchform {float: right;}


 
Zum Anfang der Seite
04.01.2009 - 16:14 Uhr
Beitrag: #3
mhm erstmal danke für die information. doch außer dass das ganze nun nach rechts ausgerichtet ist, aberimmer noch nach unten in neuer zeile verschoben ist, hat sich nichts geändert....

 
Zum Anfang der Seite
04.01.2009 - 20:38 Uhr
Beitrag: #4
Dann versuch es mal so:




1

PHP-Quelltext

#searchform table {float: left;}


 
Zum Anfang der Seite
04.01.2009 - 21:53 Uhr
Beitrag: #5
dann steht das ganze wieder links. firebug hilft mir leider auch nicht weiter =(
also hier die Bearbeitungsseite: http://9876789.98.funpic.de/page/include.php?path=login/userinfo.php um das Problem vll anschulicher angehen zu können.

 
Zum Anfang der Seite
04.01.2009 - 22:58 Uhr
Beitrag: #6
) dein Div-Container.

Sprich: zwischen der schließenden Zeile und den Tabellen-Ende
Siehe hier:
Ähhm...

Du hast in einer Tabelle innerhalb einer Spalte einmal das Hintergrundbild.
Nach dieser Spalte und Zeile (nach dem



1
2
3
4

PHP-Quelltext

<td align="center" width="980" height="128" style="background: url(/page/images/style/archiabi10/pics/head_bg1.png) no-repeat;"></td>
</
tr>
<
div id="header_pic"><div id="search"></div><div id="searchform"><table><tr><td>text</td></tr></table></div>
</
div>    
Du kannst nicht zwischen Zeilen oder Spalten einfach andere HTML-Elemente benutzen. Innerhalb einer Tabelle nur in der Spalte.

 
Zum Anfang der Seite
05.01.2009 - 08:39 Uhr
Beitrag: #7



1
2
3
4
5
6
7
8
9

Quellcode

#searchform {
    
floatleft;  
    
margin-top: -61px;
    
padding-left706px;
    
height80px;
    
z-index:10;
    
overflowvisible;
    
position: static;
}


das Problem: selbst der z-index scheint keine Abhilfe zu schaffen (ist der höchste den ich habe daran kansn nciht liegen!) der Text wird immer hinter der Header-Grafik angezeigt (hab da übrigens noch etwas merkwürdiges entdeckt: bei den news&artikeln verschiebt sich das ganze design leicht nachh rechts. hab aber vieles am bilschirmrand orientiert



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

Quellcode

#header_pic {
    
margin-top61px;
    
margin-right10px;
    
margin-left19px;
    
width:958px
    
height100px
        
positionabsolute;
        
border-stylesolid;
        
border-width1px;
}

#minitabs {
    
padding-top164px;
    
padding-bottom0px;
        
positionabsolute;
        
margin-left19px;
}

#logo {    
    
padding-left526px;    
    
width227px;
    
padding-top: -20px;  
    
background-repeatno-repeat;
     
z-index:5;
              
positionabsolute;
    
overflowhidden;
sodass dieses links bleibt und so "rausrutscht".)
Ich denke das ganze stellt jetzt kein Problem mehr mit der Positionerung sondern dem CSS-Code da oder? Konnte allerdings keine Lösung ergooglen um den Inhalt im Vordergrund zu halten (für das zweite Problem ist mir auch keine Lösung eingefallen).

 
Zum Anfang der Seite
05.01.2009 - 11:08 Uhr
Beitrag: #8
Du solltest erstmal dafür sorgen, das der HTML-Code stimmt. Es besteht immer noch der selbe Fehler an der besagten stelle. Du hast da jetzt zwar was geändert, allerdings nur einen Teil.

Z-Index-Werte helfen glaub ich nur bei absoluten Positionierungen. Da dies nur einmal mit z-index vorkommt (in deinen post, auf der Seite siehts anders aus), nützt dieser dann nicht.

Und bei mir erscheint der Text. Zwar etwas verdeckt, aber erscheint. Und zwar rechts, unterhalb von Gästebuch.
Bei Firefox sieht man es ganz wenig, da das Headerbild im Wege ist, welches allerdings in Opera nicht erscheint.
Im IE sieht man alles ansich richtig dargestellt (im FF ist das Hederbild linksbündig), allerdings sieht man den "Text" nicht.

 
Zum Anfang der Seite
05.01.2009 - 11:16 Uhr
Beitrag: #9
die table wird doch mit einem <tr> weitergührt für die unternavi...
ahh jetzt weiß ich was du meinst =) ich soll die anderen divs auch hochziehen?^^ kann ich ja mal versuchen. doch erstmal waren deine ganzen efststellungen ein rückschlag zwinkern bisher dachte ich wneisgtens das headerbild hätt funktioniert....
also muss ich das agnze absolut positioneren? aber dass behebt ja nicht das verutschen auf dne news und artiekl seiten...?!

habsjetzt erstmal so:



1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20

Quellcode

<tr width="980">
<
td align="center" width="980" height="128" style="background: url($c_head) no-repeat;">
<
div id="searchform"><table><tr><td>text</td></tr></table></div>
</
td>
</
tr>
<
tr>
<
td align="center" width="980">
<
div id="header_pic"><div id="search"></div>
</
div>    
<
div id="minitabs">
<
ul id="minitabs">
    <
li><a id="current" href="#">Home</a></li>
    <
li><a href="#">About us</a></li>
    <
li><a href="#">Products</a></li>
    <
li><a href="#">Services</a></li>
    <
li><a href="#">Contact</a></li>
</
ul
</
div>
</
td>
</
tr>

wenn ich jetzt an margin und padding eingabe rumspiele und positionere müsstes funktionieren?


EDIT: bei der Lösung ist durch das tr jetzt außerdem eine unschöne lücke zwischen header und content ist mir aufgefallen, sit das durch colspan zu lösen?

Dieser Beitrag wurde bereits 2 mal editiert, zuletzt von archipage - 05.01.2009 - 12:00 Uhr
 
Zum Anfang der Seite
05.01.2009 - 12:20 Uhr
Beitrag: #10
CSS ist eine reine Fummelarbeit. Vorallem dank IE, der einfach das macht, was man nicht will .. ^^"
Vorallem ist aber ein gut strukturierter Template-Aufbau sehr wirkungsvoll.

Bei absoluten Positionierungen sollte man bisschen aufpassen. Gibt da ein paar gemeinheiten, die man nicht kennt oder sofort erkennen könnte ;o
Wenn du willst, kann ich dir noch weitere Template-Fehler, sowie Dinge, die man mit CSS hätte lösen können, sagen ;p
Und umso mehr ich mir den Quellcode ansehe, umso mehr denke ich, du bist noch lange nicht mit der Seite fertig ;o

Aber genug kritisiert ôo
Und ansich ja. Rumspielen an den Werten sollte langen.

Versuchs es aber mal so:




1
2
3
4
5
6
7

PHP-Quelltext

#header_pic { 
    
margin0px 15px;
    
width958px;  
    
height100px;  
    
border-stylesolid
    
border-width1px
    }
Im Grunde ohne absolute Position, da dies bereits in einer Tabelle drin ist und durch die genug definiert wurde.
Solltest du ohne Tabellen arbeiten (wollen), muss man sich eine Struktur ausdenken, wie man zwischen Header, Body und Fuss (optional) unterscheiden will.

//edit Das einzige, was mir auffällt, ist der Header halt unterschiedlich in den Browsern positioniert ist.
In Opera und FF ist es in den Content-Bereich verrutscht, und im IE auch, mit der besonderheit, das es rechtsbündig und noch weiter raus geht.

Dieser Beitrag wurde bereits 1 mal editiert, zuletzt von k!r!ka - 05.01.2009 - 12:26 Uhr
 
Zum Anfang der Seite
05.01.2009 - 12:25 Uhr
Beitrag: #11
nenen ohne tabellen beim kit...das war der reinste horror als ich das vor einem jahr mit dem design probiert habe. header und footer gingen noch wunderbar. abder der content..ne durch die ganzen tabellen die ja überall sind war das der rienste horror. ich will einfach nur dass es funktuioniert zwinkern
und für von dir gennnate "Kritik" bin cih immer offen schließlich bringt einen da sja wieter...
aber eins nach dem anderen grosses Lachen
ertsmla probier ich jetzt das mit dem rumspielen aus udn versuche irgentwie die wieße linie wegzubekommen. und dann muss ja auch noch der text sichtbar egmacht werden und nicht im hintergrund liegen =0
arbeit ich komme  gelangweilt
hilfe ich brauche   danke!


edit: bei der Lösung ist das ganze ding zwar mittig aber immernoch nach unten geutscht! ich versuche also mal negativve werte.

Dieser Beitrag wurde bereits 1 mal editiert, zuletzt von archipage - 05.01.2009 - 12:28 Uhr
 
Zum Anfang der Seite
05.01.2009 - 12:33 Uhr
Beitrag: #12
zu deinem edit: ja das ist aber eigentlich eine gute nachricht =) weil ich für den ie noch eine extra css datei habe die einbindung funktionert auch, kann da also alles wieder hinterher zurechtrücken wenns im firefox funktioniert.

hab jetzt margin: -60px 15px; genommen. problem: es rutscht der gesamte untere bereich mit. das headerbild kommt aber nicht weiter "hervor"

 
Zum Anfang der Seite
05.01.2009 - 23:10 Uhr
Beitrag: #13
okay. ganz neue ausgangsposition :P im firefox funktioniert alles =)
supi!!! jedenfalls in meinem firefox^^




1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20

Quellcode

<tr width="980">
<
td align="center" width="980" height="128" style="background: url($c_head) no-repeat;">
<
div id="header_pic"><div id="search"><div id="searchform"><table><tr><td>text</td></tr></table></div></div>
</
div>    
</
td>
</
tr>
<
tr>
<
td align="center" width="980">
<
div id="minitabs">
<!-- <
ul id="minitabs">
    <
li><a id="current" href="#">Home</a></li>
    <
li><a href="#">About us</a></li>
    <
li><a href="#">Products</a></li>
    <
li><a href="#">Services</a></li>
    <
li><a href="#">Contact</a></li
</
ul> -->
navi2
</div>
</
td>
</
tr>



nur im internetexplorer wirds total falsch angezeigt. allerdings bringt ein spielen mit padding und/oder margin werten anscheinend nicht das header bild bleibt immer abgewschnitten. die navi2 muss irgentwo hinter leigen, erschient gar nciht. zwischen header und content ist noch eine lücke.
nun woran könnte das liegen? und voralledningen wie bekomme ich das in den griff?

 
Zum Anfang der Seite
05.01.2009 - 23:58 Uhr
Beitrag: #14
In Opera funktioniert es auch ;o

Was IE angeht:
In der Datei für den IE steht das



1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16

PHP-Quelltext

#header_pic {
/*    margin-top: 66px;
    margin-right: 10px;
    margin-left: 10px;
    width:958px; 
    height: 100px; 
        position: absolute;
        border-style: solid;
        border-width: 1px;
*/
    
margin: -59px 10px;  
    
width958px;    
    
height100px;    
    
border-stylesolid;   
    
border-width1px;   
}
Mach mal das margin: -59px 10px; zu dem margin: 0px 10px;.


Was den Abstand zwischen Header / Content angeht:
Bei dir steht das



1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19

PHP-Quelltext

#search {
    
backgroundurl(http://9876789.98.funpic.de/page/style/login_bg.gif); 
              
filter:alpha(opacity=35); 
              -
moz-opacity0.35
              
opacity0.35;
    
background-repeatno-repeat;
    
/*padding-top: -30px;*/
    /*padding-left: 706px;*/
    
background-position:698px 9px;
    
height89px;
     
z-index:1;
    
position: static;
        
overflowvisible;
}

#header_pic {
    
background#FFF url(http://9876789.98.funpic.de/page/style/site_top_forum.jpg); 
         
border-color:#98E600;
}
Mach daraus mal das



1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21

PHP-Quelltext

#search {
    
backgroundurl(http://9876789.98.funpic.de/page/style/login_bg.gif);
    
background-repeatno-repeat;
    
background-position698px 9px;
    
filter:alpha(opacity=35);
    -
moz-opacity0.35;
    
opacity0.35;
    
height89px;
    }

#searchform {
    
positionabsolute;
    
top20px;
    
left20px;
    }

#header_pic {
    
background#FFF url(http://9876789.98.funpic.de/page/style/site_top_forum.jpg); 
    
border-color#98E600;
    
positionrelative;
    }
Bei #searchform sind Top- und Left-Angaben. Die kannste ändern, sodas die Tabelle dort hin kommt, wohin du willst.
Ist jetzt nichts getestet, nur .. grob Überlegt ôo"

 
Zum Anfang der Seite
06.01.2009 - 09:31 Uhr
Beitrag: #15
wow! danke k!rika!
hab jetzt folgende Datei für IE



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

Quellcode

#header_pic {
/*    margin-top: 66px;
    margin-right: 10px;
    margin-left: 10px;
    width:958px; 
    height: 100px; 
        position: absolute;
        border-style: solid;
        border-width: 1px;
*/
    
margin: -59px -480px;  
    
width958px;    
    
height100px;    
    
border-stylesolid;   
    
border-width1px;   
   
positionabsolute;
}

#minitabs {
    
margin: -20px 10px;
      
positionabsolute
        
}

#logo {    
    
padding-left56px;    
    
padding-top0px;  
    
background-repeatno-repeat;
     
z-index:5;
              
positionabsolute;
    
overflowvisible;



#searchform {
   
positionabsolute;  
    
top0px;  
    
left229px;  
   
z-index:10;

}



.
dock img behaviorurl(http://9876789.98.funpic.de/page/style/iepngfix.htc) }


funktioniert soweit shcon mal prima. nur das header bild bekam ich ohne absolute nicht weit genug nach oben. wenn ich negative margin angabe für top verwende verschwandt wieder nur ein teil des bildes, wird oben also abgeschnitten. und das mit der linie kriege ich irgentwei nicht gelöst. ich verstehe ncihnt weiso der abstand dort erscheint.
aber wenigstens schonmal nur noch dieses eine kleine Problem.
wwobei ich mcih bei postion abselute frage ob bei anderen Bildschirmauflösungen das ganze dann nicht falsch dargestellt wird?

Dieser Beitrag wurde bereits 1 mal editiert, zuletzt von archipage - 06.01.2009 - 10:30 Uhr
 
Zum Anfang der Seite
 Seiten (2):    1     2    Next    >  

Ähnliche Themen
 
HTML HTML » Klapptext funktioniert im IE nicht - Letzte Antwort von k!r!ka am 02.11.08, 14:16 Klapptext funktioniert im IE nicht  (02.11.08, 14:16)
Support Support » link us , funktioniert nicht!?!? - Letzte Antwort von rommel am 18.01.08, 22:06 link us , funktioniert nicht!?!?  (18.01.08, 22:06)
PHP/MySQL PHP/MySQL » SQL-Abfrage funktioniert nicht richtig - Letzte Antwort von msycho am 04.04.07, 15:05 SQL-Abfrage funktioniert nicht richtig  (04.04.07, 15:05)
Support Support » BB Klapp Code funktioniert nicht - Letzte Antwort von WEBI am 05.08.07, 17:09 BB Klapp Code funktioniert nicht  (05.08.07, 17:09)
Fragen und Antworten Fragen und Antworten » Diese Seite funktioniert nicht - Letzte Antwort von k!r!ka am 18.12.20, 04:19 Diese Seite funktioniert nicht  (18.12.20, 04:19)

HTH-C.com - Webmedien & Community