Computer Hardware Forum - TweakPC - html Problem bei der Tabelle! Hilfe!

Seite 1 von 2

60 Beiträge dieses Themas auf einer Seite anzeigen

Computer Hardware Forum - TweakPC (https://www.tweakpc.de/forum/)

- Programmiersprachen (https://www.tweakpc.de/forum/programmiersprachen/)

- - html Problem bei der Tabelle! Hilfe! (https://www.tweakpc.de/forum/programmiersprachen/19636-html-problem-bei-der-tabelle-hilfe.html)

LeoHart

21.10.2004 20:23

html Problem bei der Tabelle! Hilfe!

Hallo,
da unser verrückter Infomatiklehrer vor den Ferien gesagt hat,so jetzt schreibt jeder eine HP über den Ferien, und ich nicht gerade weit bin *leider :cry: * brauch ich einwenig hilfe! Nein ihr sollt mir keine Hp schreibe das machen noch selbst :wink: doch hab ein Problem mit einer Tabelle ---(Quelltext)-->

[code]<html>
<head>
<title>leftframe</title>
</head>

<body background="background2.bmp">
<table width="166" border="0" cellspacing="0" cellpadding="0">
<tr>
<map name="leftframe1">
<area shape="rect" coords="2,4,97,25" href=".html">
<area shape="rect" coords="2,32,97,51" href=".html">
<area shape="rect" coords="2,58,97,77" href=".html">
<area shape="rect" coords="1,107,152,121" href=".html">
</map>
<img src="Leftframe_Picture1.bmp" usemap="#leftframe1" border="0">
</tr>

<tr>
<map name="leftframe2">
<area shape="rect" coords="2,4,97,24" href=".html">
<area shape="rect" coords="2,29,97,49" href=".html">
<area shape="rect" coords="2,54,97,75" href=".html">
<area shape="rect" coords="1,104,152,118" href=".html">
</map>
<img src="Leftframe_Picture2.bmp" usemap="#leftframe2" border="0">
</tr>
</table>
</body>
</html>[/code]
Sind zwei Bilder und Teile davon sind eben "links" mein Prob ich wollte die Bilder zusammen schieben so das es ein Bild ergibt doch leider ist da immer ein Abstand zwischen trotz border="0" .Ich hoffe man versteht was ich will! Kann mir einer helfen!?

Danke

tele	21.10.2004 21:55

liegt an der interpretaion mancher browser, musste mal die margins drumherum wegmachen

am besten mit dem css code

style="margin:0px;"

kerri

21.10.2004 23:25

Also es duerfte daran liegen, das die tabellenzellen <td> und </td> fehlen, die die img-tags umschliessen muessen. Dabei duerfen zwischen den ganzen <tr> und <td> und img- tags keine Leerzeichen oder Enters sein, da die dann auch dargestellt werden und so die Bilder auseinanderruecken.
Das cellpadding='0' und cellspacing='0' im <table>-tag sollten dann den gewuenschten Erfolg bringen.

Den Code ordentlich einzuruecken kann auch nie schaden, und die maps koennen an beliebiger Stelle stehen, was meist die Lesbarkeit des Codes erhoeht. Und Kommentare schaden auch nie, das mag zwar fuer den Anfang etwas ueberfluessig erscheinen, wenn der Code dann aber komplizierter wird, erleichtert auch das die Lesbarkeit und uebersichtlichkeit ungemein.

[code]
<html>

<head>
<title>leftframe</title>
</head>


<body background="background2.bmp">


<table width="166" border="0" cellspacing="0" cellpadding="0">

<tr><td><img src="Leftframe_Picture1.bmp" usemap="#leftframe1" border="0" alt=""></td></tr>
<tr><td><img src="Leftframe_Picture2.bmp" usemap="#leftframe2" border="0" alt=""></td></tr>

</table>



<map name="leftframe1">
<area shape="rect" coords="2,4,97,25" href=".html">
<area shape="rect" coords="2,32,97,51" href=".html">
<area shape="rect" coords="2,58,97,77" href=".html">
<area shape="rect" coords="1,107,152,121" href=".html">
</map>


<map name="leftframe2">
<area shape="rect" coords="2,4,97,24" href=".html">
<area shape="rect" coords="2,29,97,49" href=".html">
<area shape="rect" coords="2,54,97,75" href=".html">
<area shape="rect" coords="1,104,152,118" href=".html">
</map>

</body>
</html>

[/code]

Ausserdem vielleicht mal die [url=http://de.selfhtml.org/html/tabellen/aufbau.htm]tabellenseite von selfhtml[/url] lesen. Dann ist vielleicht die <tr>-<th>-<td>-Verwirrung etwas gelindert ;)

Was mir noch aufgefallen ist: bmps sind nicht unbedingt das gaengigste Bildformat im Web, weil die meist eine verhaeltnismaessig sehr grosse Dateigroesse (=lange download- und seitenaufbauzeiten fuer modemler) haben und Du auf aneren Plattformen ausser Windows damit Probleme bekommen keonntest. Wandel die lieber um in gif, jpg oder png, die sind kleiner und werden ueberall verstanden.

Gruese, kerri

LeoHart

22.10.2004 10:30

Ist mir klar das man keine .bmp dateien verwenden sollte(2Mb für ein Bild :lol: )
Jo, dat sieht im editor etwas ordentlicher aus aber irgendwie wollte das Forum es nicht so posten wie ich es gerne hätte,naja! Werde es mal versuch :)

:edit:

Danke hat geklappt :D

LeoHart

22.10.2004 11:18

Noch ein kleines Problem und zwar habe ich zwischen dem oberen Frame und den linken jetzt einen Abstand den möchte ich aber net haben nur wie geht er weg mit vspace"0" klappt es nicht *wäre auch nur zu schön gewesen*

[img]http://people.freenet.de/Team-Naomi/prob.JPG[/img]

kerri

22.10.2004 11:51

Ich vermute, du hast noch keine seitenraender gesetzt. mit html geht das so:
[code]
<body marginwidth="0" marginheight="0" topmargin="0" leftmargin="0" background="blahblah.jpg">
[/code]
einfach in jede Datei (also in alle, die in die Framesets geladen werden) die ganzen margins einfuegen.

alternativ gehts auch mit css:
[code]
<style type="text/css">
body { margin:0px; }
</style>
[/code]
das packst du dann in jede Datei in den head tag oder zwischen head und body.

Gruesse, kerri

LeoHart

22.10.2004 15:02

Danke !
Super,seit echt eine große Hilfe :D :D :D

kerri

22.10.2004 15:59

Dafuer sind wir ja da ;) :D

Gruesse, kerri

LeoHart

22.10.2004 17:14

Ich hoffe das letzte Problem.*eher nicht* Ich bin mir auch nicht sicher ob das überhaupt geht doch.....
Hab die Hp ja in drei Frames unterteilt nur was mich stört ist das jeder Frame einzeln scrollbar ist,klar man kann scrollen auch abstellen aber da gäbe es Probleme bei manchen Auflösungen.Meine Frage kann man trotz Frames programmierung eben wie es bei Tweakpc der fall ist ein Scrollbalken für alle benutzen (einer rechts und einer unten)?!
Es wöre wohl einfacher gewesen wenn ich von vornherrein es mit der Tabelle gemacht hätte,doch naja :?

EoN	22.10.2004 18:31

Das geht mit Frames nicht, denn das ist ja gerade der Sinn von ihnen.

Um das zu erreichen musst du gleich komplett mit Tables arbeiten und die Frames weglassen.

LeoHart

22.10.2004 21:55

Habs mir gedacht nun gut,werd ich irgendwann mal umschreiben aber für die Schule reichen auch noch Frames :P

Kann mir einer sagen wie ich die Links ändern kann das man wenn man erst mit der Maus drauf geht sich die Farbe und der Link sich unterstreicht machen kann?!

kerri

22.10.2004 23:18

Auch hier hilft [url=http://de.selfhtml.org/css/eigenschaften/pseudoformate.htm#link_visited_hover_active_focus]selfhtml[/url].

Gruese, kerri

LeoHart

22.10.2004 23:30

Wenn ich wüsste das es Pseudoformat hieß,tja dann hät ich es auch gefuden :wink:
Oh man muss noch viel lernen :(

kerri

23.10.2004 00:37

Keine Sorge, Uebung macht den Meister und alle haben mal klein angefangen ;) Mit der Zeit kriegst Du schon mit, wo Du bei selfhtml suchen musst, um das zu finden, was du gerade brauchst :D

Gruesse, kerri

LeoHart

23.10.2004 23:17

Ich bins wieder :(
Wie bekomme ich das so hin (siehe Bild),geht dies überhaupt.Wenn es nicht geht dann zeichne ich eine Tabelle und benutze dat dann als Hintergrund und schreibe mit html über das Bild :?
Ich will ja ein Bild das sich aus mehrere Bilder zusammen setzt haben und in der Mitte steht ein Text doch der soll wieder in einer Taballe sein. Nur das Problem wie programier ich eine Tabelle in einer Tabelle?!
[img]http://people.freenet.de/Team-Naomi/prob2.JPG[/img]

EoN	23.10.2004 23:37

Ganz einfach, du fügst in eine Zelle einer Tabelle einfach eine neue Tabelle ein.

Also so in der Art:
[code]
<table>
<tr>
<td><table><tr><td>bla</td><td>cla</td></tr></table></td><td>dla</td>
</tr>
<tr>....
</tr>
</table>
[/code]

kerri

23.10.2004 23:49

EON, Du hast n paar td's und tr's verwechselt ;) Aber das Konzept sollte auch so klar werden ;)

@Leo: Du kannst beliebig viele tags ineinanderschachteln, etwa so:
[code]
<b><i>Fetter Kursiver Text</i></b>
[/code]
solange Du das 'innere' Tag (im Beispiel das i-tag) vor dem aeusseren schliesst. Nicht anders ists mit Tabellen, Du kannst beliebig viele ineinander schachteln, also etwa so, wies EON vorgemacht hat. nur musst Du dann auch (logisch) die zuletzt geoeffnete zuerst schliessen.

Gruesse, kerri

EoN	23.10.2004 23:53

Öh oh ja..... danke :)

LeoHart

25.10.2004 15:02

So komme langsamen aber sicher voran,einen von zehn links sind fertig :D (naja nicht ganz,der Haupteil ist fertig,der Nebenteil links davon noch nicht :-( )
Eine Frage was kann man mit eigebetten Frames anfagen und kann man die später in einer Tabelle fassen?!
Hab ja jetzt meine Hp in 3 Frames,will die aber später mal in eine Tabelle umschreiben.Und ich hab jetzt vom Hauptframe den mittleren Teil mit Tabellen programiert und genau davon aus soll links jetzt wieder ne Tabelle sein deswegn dachte ich,es wäre am einfachsten wenn man irgendwie daraus zwei frames machen könnte oder (deswegen eingebette frames*was das auch immer sien soll*?! :?

Oder wie würdet ihr es machen?!

kerri

25.10.2004 17:00

Ich wuerde jetzt sofort, wo noch nicht so viel da ist, das Konzept umstellen, und nicht erst spaeter, wenn Du sehr viel mehr Seiten hast, die Du bearbeiten muesstest. Generell bin ich auch kein Fan von Frames, weder normale, noch eingebettete (Warum? [url=http://de.selfhtml.org/html/frames/layouts.htm]siehe hier[/url].), es sei denn das Design laesst sich nicht mit Tabellen hinbasteln, und so eine Seite ist mir noch nie untergekommen ;) .
Also mach Dir lieber jetzt etwas zusaetzliche Arbeit, als spaeter sehr viel mehr zusaetzliche Arbeit. Ich kann aus eigener Erfahrung berichten, das es absolut oede Arbeit ist, 40 und mehr Teilseiten an ein neues Layout anzupassen.

Gruesse, kerri

LeoHart

25.10.2004 17:29

Oh man das gibt ne Arbeit und vorallem kann mich mir schon vorstellen wie mein Quelltext aussieht:
Kleine kostprobe von der einen "Tabellenseite".
[code]
<body background="background2.bmp" marginwidth="0" marginheight="0" topmargin="0" leftmargin="0">

<table border="0" cellspacing="0" cellpadding="0" vspace="0" align="left" valign="top" hspace="0">
<tr><td valign="top"><img src="links_picture/links_left.bmp">
<td valign="top">

<table border="0" cellspacing="0" cellpadding="0" vspace="0">
<td><img src="links_picture/links_mitte.bmp"></td>
<tr><td bgcolor="EFEFEF">
<br<br><br><a href="http://www.t-online.de/"><ul>
<li><basefont size="2" face="system"><b> T-Online</b><br><br></li>
</ul></a></td></tr>
<tr><td><img src="links_picture/links_mitte2.bmp"></td></tr>
<tr><td bgcolor="EFEFEF"><br><a href="http://www.max-lauer.de.vu"><ul>
<li><basefont size="2" face="system"><b>Dick_Tator</b></li></a>
<br><a href="http://www.Team-Naomi.de.">
<li><basefont size="2" face="system"><b>Schabrackenschakal</b></li></a>
<br><a href="http://www.de.vu">
<li><basefont size="2" face="system"><b>Mr.Headshot</b></li></ul></a><br><br><br></td></tr>
<tr><td valgin="bottom"><img src="links_picture/links_unten.bmp"></td></tr>
</tr>
</table>
[/code]
Ging irgendwie nicht besser :lol:

kerri

25.10.2004 20:29

also was mir jetzt so spontan auffaelt:

Du machst zwei tabellen auf, aber nur eine wieder zu?
In der inneren Tabelle (erste zeile, die die mit <td> img src="lin ... losgeht) felhen irgendwie ein paar <tr>'s
Die Links find ich schon seltsam: a ul li text /li /a [....] /ul also erst a auf, dann ul auf, dann ein listenitem, und dann a wieder zu? Wie war das mit den verschachtelten tags? Das zuerst schliessen, was zuletzt geoeffnet wurde ;) Oder grafisch, da wirds vielleicht etwas besser verstaendlich:
[img]http://www.rzuser.uni-heidelberg.de/~krichte4/pics/extpics/tagkreuzung.gif[/img]
Aslo ist es am besten, du machst: ul li a href linktext /a /li li a anderertext /a /li /ul (sry wegen der klammern, geht hier im Forum nicht besser)

In manchen Browsern funktioniert Dein Code sicher, aber andere koennten sich weigern ;)

Gruesse, kerri

LeoHart

26.10.2004 13:02

Muss ich mir wohl mein Gewusel nocheinmal ansehen.

Doch noch eine Frage zu den Tabellen.
Hab jetzt mal die Frames in einer Tabelle gefasst,*ging leichter als ich dachte* einziges Problem (problem ist ähnlich wie das mit dem Abstand) das eben das obere Bild in der Zelle unten einen kleinen Abstand hat (oben jedoch nicht)k.a warum,doch der "links"Teil ist genauso programmiert doch da ist nirgendwo ein Abstand ?! Was ist da falsch-->

[code]
<body background="background2.bmp">

<table width="778" border="1" cellspacing="0" cellpadding="0" vspace="0">
<tr><td>
<img src="overframe_Picture.bmp" usemap="#main" border="0">
</td></tr>

<map name="main">
<area shape="rect" coords="1,129,153,150" href="Team-Naomi2.html">
</map>

<tr><td><table width="166" border="1" cellspacing="0" cellpadding="0" vspace="0">
<tr><td><img src="left_frame_picture/Leftframe_Picture1.bmp" usemap="#leftframe1" border="0"></td></tr>
<tr><td><img src="left_frame_picture/Leftframe_Picture2.bmp" usemap="#leftframe2" border="0"></td></tr>
<tr><td><img src="left_frame_picture/Leftframe_Picture3.bmp" usemap="#leftframe3" border="0"></td></tr>
<tr><td><img src="left_frame_picture/Leftframe_Picture4.bmp" usemap="#leftframe4" border="0"></td></tr>
<tr><td><img src="left_frame_picture/Leftframe_Picture5.bmp" usemap="#leftframe5" border="0"></td></tr>
<tr><td><img src="left_frame_picture/Leftframe_Picture_end.bmp" border="0"</td></tr>
</table></td>

</table>
</body>
</html>
[/code]

kerri

26.10.2004 15:43

Du mienst das Bild overframe_Picture.bmp?
Wenn ja, liegt das daran, da du da zwei tabellen ineinander verschachtelt hast, de jeweils die border = 1 haben. Also hat das erste Bild, overframe_Picture.bmp, einen Seitenabstand von 1 und alle anderen haben einen Seitenabstand von 2 (border der inneren Tabelle + Border der aeusseren Tabelle).
Ich hoffe, Du hattest das gemeint ;)

Gruesse, kerri

LeoHart

26.10.2004 19:36

Ja doch normalerweise müsste dort kein Abstand sein oder?! Oder eher wie bekomme ich den weg?! Der Rand war nur um zugucken wo das Problem ist !

[img]http://people.freenet.de/Team-Naomi/prob3.JPG[/img]

kerri

26.10.2004 20:01

So:
[code] <body background="background2.bmp">

<table width="778" border="0" cellspacing="0" cellpadding="0" vspace="0">
<tr><td>
<img src="overframe_Picture.bmp" usemap="#main" border="0">
</td></tr>
<tr><td><table width="166" border="0" cellspacing="0" cellpadding="0" vspace="0">
<tr><td><img src="left_frame_picture/Leftframe_Picture1.bmp" usemap="#leftframe1" border="0"></td></tr>
<tr><td><img src="left_frame_picture/Leftframe_Picture2.bmp" usemap="#leftframe2" border="0"></td></tr>
<tr><td><img src="left_frame_picture/Leftframe_Picture3.bmp" usemap="#leftframe3" border="0"></td></tr>
<tr><td><img src="left_frame_picture/Leftframe_Picture4.bmp" usemap="#leftframe4" border="0"></td></tr>
<tr><td><img src="left_frame_picture/Leftframe_Picture5.bmp" usemap="#leftframe5" border="0"></td></tr>
<tr><td><img src="left_frame_picture/Leftframe_Picture_end.bmp" border="0"</td></tr>
</table></td>
</tr>
</table>

<map name="main">
<area shape="rect" coords="1,129,153,150" href="Team-Naomi2.html">
</map>

</body>
</html>

[/code]

sollte es eigentlich funktionieren..... die Tabellenraender sollteste schon auf 0 setzen, sonst hast da immer einen Rand von mindestens einem Pixel. Und die maps immer schone dahin packen, wo sie nicht stoeren.

Gruesse, kerri

LeoHart

26.10.2004 20:45

Jo danke.
Doch hab gerade gemerkt das ich das so wie ich es vor hatte nicht machen kann :(
Muss das obere Bild in zwei Teile schneiden,naja lieber erst denken und dann handeln .Hätte mir arbeit ersparrt :(

LeoHart

26.10.2004 22:10

Kann man ein Bild in einen Tabellenzelle ausrichten?! Wenn ja kann mir einer den Befehl sagen irgendwi mit valign="bottom" will sich das Bild nicht bewegen.Oder einen befehl mit dem ich es in der Zelle einwenig nach unten verschieben kann !?

kerri

26.10.2004 22:11

Stop, vorm schneiden.... man kann auch [url=http://de.selfhtml.org/html/tabellen/zellen_verbinden.htm]tabellenzellen verbinden[/url]..... bei dir wuerde das dann so aussehen:
[code]
<body background="background2.bmp">

<table width="778" border="0" cellspacing="0" cellpadding="0" vspace="0">
<tr><td colspan="2"> 
<img src="overframe_Picture.bmp" usemap="#main" border="0">
</td></tr>
<tr><td><table width="166" border="0" cellspacing="0" cellpadding="0" vspace="0">
<tr><td><img src="left_frame_picture/Leftframe_Picture1.bmp" usemap="#leftframe1" border="0"></td></tr>
<tr><td><img src="left_frame_picture/Leftframe_Picture2.bmp" usemap="#leftframe2" border="0"></td></tr>
<tr><td><img src="left_frame_picture/Leftframe_Picture3.bmp" usemap="#leftframe3" border="0"></td></tr>
<tr><td><img src="left_frame_picture/Leftframe_Picture4.bmp" usemap="#leftframe4" border="0"></td></tr>
<tr><td><img src="left_frame_picture/Leftframe_Picture5.bmp" usemap="#leftframe5" border="0"></td></tr>
<tr><td><img src="left_frame_picture/Leftframe_Picture_end.bmp" border="0"</td></tr>
</table></td>

<td>

</td>

</tr>
</table>

<map name="main">
<area shape="rect" coords="1,129,153,150" href="Team-Naomi2.html">
</map>

</body>
</html>
[/code]

Gruesse, kerri

kerri

26.10.2004 22:15

[quote=LeoHart]Kann man ein Bild in einen Tabellenzelle ausrichten?! Wenn ja kann mir einer den Befehl sagen irgendwi mit valign="bottom" will sich das Bild nicht bewegen.Oder einen befehl mit dem ich es in der Zelle einwenig nach unten verschieben kann !?[/quote]

Hast Du das valign im td tag stehen? dann muesste es eigentlich funktionieren.

ansonsten machst halt einfach ein bis 2 br vor das bild ;)

Gruesse, kerri

LeoHart

26.10.2004 23:20

Also das mit den colspan klappt teilweise,es ist jetzt da wo es sein soll jedoch ist links ein Abstand (rechts ist egal ob da ein abstand ist).

Das einzige was wirklich nicht funktionieren will ist der Abstand vom oberen Bild :? es will weder mit einem Befehl ein stück nach unten weder mit br (bei br zieht es einfach die Zelle länger und lasst den Abstand so wie der ist) ich verstehe aber nicht warum. Meine einzige erklährung ist das das obere Bild nicht so hoch ist wie ein Teilbild von der Tabelle in der der unteren Zelle,doch das müsste eigentlich egal sein.Da doch jede Zeile einen eigen höhe annehmen kann(je nach dem wie groß die größte Zelle von der Zeile ist oder?) Ich versteh es nicht :( :cry: Bin am verzweifeln!

tele	27.10.2004 06:43

habe ich oben schon geschrieben - liegt an der default margin interpretation mancher browser

schnap dir mal selfhtml, schlag die css kurzreferenz auf und guck mal unter margin nach

LeoHart

27.10.2004 10:50

Jo,doch kannst mir auch sagen wo ich den befehl einsetzen soll :?

LeoHart

27.10.2004 17:50

Dumme Frage sorry :( Bin eben verzweifelt !
Irgendwie will es nicht klappen
[code]
<head>
<title>margin-bottom</title>
</head>

<body background="background2.bmp">
table width="778" border="1" cellspacing="0" cellpadding="0" vspace="0">
<tr><td colspan="3">
<img src="overframe_Picture.bmp" usemap="#main" border="0" style="margin-bottom:0cm">
</td></tr>
[/code]
Mach ich was falsch?!

kerri

27.10.2004 18:20

Hmmm..... das margin gibt eigentlich nur den Abstad nachfolgender Elemente an, verschiebt das bild aber nicht innerhalb der Tabellenzelle. Es loest also Dein Problem ueberhaupt nicht.
Besser waere hier ein <td colspan="3" valign="bottom"> oder, wenns denn unbedingt css sein muss, <td colspan="3" style="vertical-align:bottom;">
Das margin aus dem img-tag kannst rausnehmen, das hat absolut keinen effekt, wenn nach dem bild innerhalb der Tabellenzelle nichts mehr kommt.

Noch ne Frage an Dich, wieviel ist in der Zelle neben der Zelle, in der Du das bild ausrichten willst? Die ganze ausrichterei funktioniert naemlich nur, wenn in der nebenliegenden Zelle nach unten hin laenger ist, als die Zelle, die Du ausrichten willst.

Gruesse, kerri

LeoHart

27.10.2004 20:17

Also eigentlich ist die erste Zelle ein einziges Bild
dann kommt eine neu Zeile mit einer Zelle die aus fünf Bildern besteht(die in einer Tabelle untereinander stehen.)Dann kommt eben der colspan(heißt nicht das ich der befehl jetzt erst kommt) kommt eine Zelle die genau so hoch ist wie dir erste Zelle dieser Zeile und dann eben noch einen Zelle die auch genau so hoch.

Zwei Probleme in der ersten Zelle(die gleichzeitig die Zeile ist) ist ein Bild drin und unter halb dem Bild ist ein kleiner Abstand zum Rahmen wenn der oben wäre wärs mir egal.
Zweites Problem ist in der Zweiten Zeile(das ich absolut nicht verstehe( die zweite Zelle ist 2pixel denk ich höher als die erste Zelle(obwohl die eigentlich gleich groß sein müssten das selbe eben bei der dritten Zelle die auch 2pixel höher ist als die erste doch beide sind dann unten 2pixel kürzer.Also irgendwie verschiebt sich da alles,was es eignetlich nicht machen soll!

kerri

27.10.2004 20:51

Dann schieb doch in der zweiten zeile die erste zelle nach oben (standardmaessig wird nach der Mitte ausgerichtet) mit nem valign="top" in den td's der zweiten Zeile. Dann sollte es eigentich gehen.
Vielleicht auch mal versuchen, die innere Tabelle ganz an das vorhergehende td ranzuruecken (also ohne Whitespace dazwischen), etwa so: ... <tr><td valign="top"><table border="0"><tr><td valign="top"> ...
Whitespace (also alles, was Leerzeichen, [ENTER] oder Kommentare im Quelltext sind) haben dummerweise die dumme Angewohnheit, als ein einzelnes Leerzeichen in der angezeigten Seite dargestellt zu werden, was meistens das ganze Design zerhaut. Das Entfernen aller leerzeichen und [ENTER]s zwischen allen tr, td und table tags hilft da meistens, produziert aber leider meist auch ziemlich unleserlichen Code.

Gruesse, kerri

tele	28.10.2004 16:51

das margin kommt eigentlich in das table tag, padding würde in ein parent-tag kommen

LeoHart

28.10.2004 20:06

Also mit kerris Vorschlag ist das zweite Problem gelöst :D :D :D
Das erste aber besteht weiterhin :( !!Das mit margin-bottom will nicht funktionieren k.a warum.
Das erste Problem ist merkwürdig,das dürfte kein Problem sein, normalerweise müsste da garkein Abstand sein :? :? :?

kerri

28.10.2004 21:33

Pack am besten mal die Seite, inclusive aller Bilder auf einen Webspace, dann kann ich mir das 'Gesamtkunstwerk' mal anschaun, da seh ich vielleicht eher, was schieflaeuft, und kann auch selbst etwas damit rumprobieren ;)

Mit welchem Browser/welchen Browsern testest Du denn die Seite? Je mher, desto besser ;)

Gruesse, kerri

LeoHart

29.10.2004 12:25

Also eigentlich probier ich die Hp nur mit dem Explorer aus :lol:
Oh ja die online zu stellen,tja na dann muss ich erst eimal die Bilder umwandeln :lol: Kennt einer ein gutes Prog mit dem man vom bmp in gif oder jpg,ohne Qualitätsverlust umwandeln kann?!

tele	29.10.2004 15:40

paint ?

nee mal enrsthaft - kann jedes bildverabreitungsprogramm

LeoHart

29.10.2004 21:55

Ja aber wenn man das mit paint macht hat man so ne kack quali !

kerri

29.10.2004 23:07

So ziemlich jedes ordentliche Bildverarbeitungsprogramm kann das. IrfanView und GIMP gbts kostenlos, Photoshop und PaintshopPro sind auch noch alternativen, ich denke, sowas wirst schon haben oder schnell organisieren koennen.
Es gab mal unter Zubehoer bei Windows was Namens Imaging *michdunkelerinner*, vielleicht kann das das auch.

Gruesse, kerri

LeoHart

31.10.2004 17:40

Hab das Problem gelöst mit dem kleinen Abstand :D :D :D :D :D :D
Lag an den dummen "enter" zwischen <tr>und<td> die ich immer machte wägen der lesbarkeit des Quellcodes blabla(dummer Infolehrer)

Habs zufällig herausgefunden weil ich einmal ein Bild mit dem Abstand hatte und einmal ohne obwohl ich das selbe programmiert habe nur einmal mit den dummen "enters".

Danke für den Tipp kerri,bist die beste(auch danke an Telepornos) :D :D :D

kerri

31.10.2004 18:15

Hab ich aber schon ein paar mal erwaehnt, das sich die meisten Browser mit Whitespace etwas affig haben ;)

Wenn die Seite fertig ist, will ich die aber sehn, das ds klar ist ;) :lol: :lol:

Gruesse, kerri

PS.: auch mal mitm Opera und Mozilla angucken die Seite, bevor du sie auf die Menschheit loslaesst ;)

LeoHart

31.10.2004 20:04

Wenn sie fertig (naja oder halb fertig ist) werde ich den link mal posten.

Mach ich in der Schule,dort dürfen wir nur Linux benutzen.Weil unser Lehrer Windows nicht leiden kann :wink:

kerri

31.10.2004 20:55

[quote=LeoHart][...]
Mach ich in der Schule,dort dürfen wir nur Linux benutzen.Weil unser Lehrer Windows nicht leiden kann :wink:[/quote]

Yeah, endlich mal n richtig guter Lehrer ;)

Gruesse, kerri

LeoHart

14.11.2004 23:30

Hab ja lange keinen mehr mit Fragen genervt :wink:
Aber keine sorge wollte nur sagen das ich die Hp online gstellt habe.Es sind nicht viele links erreichbar doch kommt alles noch.

So ein paar infos zur Hp,es ist keine persönliche Hp sondern eine für unser GamerTeam :wink: . Und dann noch kann sein das es etwas lange dauert (kommt eben davon wenn man ein Hintergrundbild hat was 1mb groß ist sorry an die modem und isdn Benutzer versuchs noch zu ändern)

Hab die Hp nur auf dem Explorer getestet also wenn es unter Linux Probleme gibt sagt bescheid.Da ich auch erst morgen Info hab und gleichzeitig "Abgabetermin".Bitte tut die Schriftgröße auf Mittel da sonst das ganze Desgin im Eimer ist :lol: :wink: .
So das wärs dann.

tele	14.11.2004 23:43

gib doch mal bitte den link - einige brennen sicher darauf den zu sehen

LeoHart

15.11.2004 13:57

Oh verdammt vergessen zu posten,sorry :lol: :lol: :lol:

[url=http://people.freenet.de/Team-Naomi/news.html]Team-Naomi[/url]

EoN	15.11.2004 14:30

Sieht echt gut aus.

Aber anscheinend hast du mit den Tags noch irgendwo nen "Vertippsler" drinnen, denn links oben steht noch: [i]> G-Digital">[/i], was da denk ich mal nicht hingehört ;)

LeoHart

15.11.2004 16:59

K.a wo du meinst,doch habs geändert .Besser :wink:

So jetzt noch eine Frage: :wink:
Die ich aber schlecht in Worten fassen kann :? Deswegen hier mal den Quelltext.

[code]<select name="bereich">
<option value=Events><a href="internevents.thml">Events-intern</a>
<option value=News><a href="intern.thml">News-intern</a>
</select>[/code]

Hoffe man erkennt was ich vorhatte, wollte das was eben zur Auswahl steht,wenn eines davon ausgewählt wird das man dann zu einer anderen Seite gelinkt wird.
Also so klappt es nicht,wäre auch zu schön gewesen :(

kerri

15.11.2004 18:43

Also das erste, was mein kleiner firefox gemacht hat, als ich auf den Link geklickt hab, ist abstuerzen. Das ist natuerlich das schlimmste, was passieren kann.
Und im Mozilla sah die Seite dann so aus: [url=http://www.rzuser.uni-heidelberg.de/~krichte4/pics/extpics/Screenshot-21.jpg]klick mich[/url]. Auch net so doll.
Du arbeitest sehr viel mit absoluten Hoehen und Breitenangaben ( z.B. die Heoehe er News-Tabelle wird durch das uebereinanderstapeln der ganzen Randbilder erzeugt), hab ich festgesellt. Sobald da aber Text dazwischen ist, zerhaut es Dir das ganze Design (welches uebrigens sehr gut ist, kompliment!), da Text immer eine dynamische Hoehe uind breite hat. Du hast als Schriftart MSsans serif angegeben. das setzt aber voraus, das jeder, der die Seite anschauen will, genau diese Schriftart verwendet. Und ich mit meinem Linux System, wo natuerlich keine M$ Schriftarten drauf sind, kucke dann in die Roehre. Wenn ein sehbehinderter daherkommt, der ne besonders grosse Schrift braucht, um ueberhaupt was erkennen zu koennen, der schaut auch in die Roehre.

Du solltes versuchen, die ganze Sache etwas dunamischer zu gestalten. Ich habe mir mal die News-Tabelle vorgeknoepft, um Dir zu zeigen, wie man das am besten macht.
Du hast die Grafiken so aufgeteilt:
[img]http://www.rzuser.uni-heidelberg.de/~krichte4/pics/extpics/newsalt.jpg[/img]
wobei das gruene, das gelbe und das violette jeweils eigenstaendige Tabellen sind, die absolut nichts voneinander wissen (auch nicht die sehr wichtige Hoehe) - im schlimmsten Fall, siehe mein Screenie aus dem Mozilla, haben dann alle eine unterschiedliche Hoehe.
Besser waere folgende Aufteilung:
[img]http://www.rzuser.uni-heidelberg.de/~krichte4/pics/extpics/newsnew.jpg[/img]
Wobei das ganze dann in einer gemeinsamen Tabelle ist, die roten Pfeile zeigen dabei an, was dynamisch vergroesserbar ist. Dazu musst allerdings die Grafiken neu zerteilen, Ich habe mir mal erlaubt, genau das zu machen :D
In html saehe das dann so aus:
[code]
<table border='0' cellspacing='0' cellpadding='0'>
<tr>
<td><img src="linksoben.gif"></td>
<td><img src="mitteoben.gif"></td>
<td><img src="rechtsoben.gif"></td>
</tr><tr>
<td style="background-image:url(linksback.gif)" valign="top"><img src="linksmitte.gif"></td>
<td style="background-color:#efefef">



</td>
<td style="background-image:url(linksback.gif)" valign="bottom"><img src="rechtsmitte.gif"></td>
</tr><tr>
<td><img src="linksunten.gif"></td>
<td><img src="mitteunten.gif"></td>
<td><img src="rechtsunten.gif"></td>
</tr>
</table>
[/code]

Wenn Du die seitlichen Linien als Hintergrundbild definierst (mit style="background-image:url(linksback.gif)" im td-tag), weden die dann dunamisch immer genauso oft untereinander gepackt, wie die Hoehe der Tabelle das vorgibt.
So sieht das ganze dann aus:
winzige Schrift:
[img]http://www.rzuser.uni-heidelberg.de/~krichte4/pics/extpics/newnewswinzig.gif[/img]
riesige Schrift:
[img]http://www.rzuser.uni-heidelberg.de/~krichte4/pics/extpics/newnewsriesig.gif[/img]
und die Tabelle passt immer hervorragend drumrum. Selber mit der Schriftgroesse spielen kannst du [url=http://www.rzuser.uni-heidelberg.de/~krichte4/pics/extpics/newnews/]HIER[/url] (Schriftgroesse aendern geht bei mir mit Strg oder Shift + Mausrad - ich denke, unter Windows ists aehnlich.)
In den beiden Bildern siehst auch gleich, was ein US-OS mit US-Browser aus deutschen Umlauten macht, naemlich totales Kauderwelsch. Umlaute solle man daher in html 'maskieren'. Das geht folgendermassen:

[code]
&auml; ergibt ä
&ouml; ergibt ö
&uuml; ergibt ü
&Auml; ergibt Ä
&ouml; ergibt Ö
&uuml; ergibt Ü
&szlig; ergibt ß
[/code]
Damit hat dann auch kein Ami mehr irgendwelche Probeme, falls er sich mal auf Deine Seite verirren sollte.

Die ganze Seite koenntest Du dann folgendermassen dynamisch Zerlegen:

[img]http://www.rzuser.uni-heidelberg.de/~krichte4/pics/extpics/komplettneu.jpg[/img]

oder als Code:
[code]
<table>
<tr>
<td colspan='3'></td> <--rot
</tr>
<tr>
<td></td> <-- blau
<td valign='top' style="background-color:#efefef;"></td> <--gruen&gelb
<td></td> <-- aqua
</tr>
<tr>
<td></td> <-- orange
<td></td> <--schwarz
<td></td> <--violett
</tr>
</table>
[/code]
Der gelbe Bereich wird dabei automatisch mit der Hintergrundfarbe der Tabellenzelle ( style="background-color:#efefef;" ) ausgelegt.
Rote Pfeile heissen wieder: Das Bild als Hintergrund der Tabellenzelle definieren.

So, jetzt noch ein paar Sachen zu dem Waben-Hintergrunbild. Warum zum Teufel hast Du das denn als ein grosses Bild gemacht? Das kann man doch so schoen kacheln. Ist ja eigentlich Sinn des Hintergrundbildes, das man ein moeglichst kleines, platzsparendes Bildchen so oft neben und untereinander packt, bis es die ganze Seite ausfuellt. Wenn Du im Bad Fliesen verlegst, kaufst du ja auch nicht eine grosse Fliese, die fuer die ganze Wand reicht, sondern viele kleine, mit der Du die Wand dann auskleidest.
Dein Hintergrundbild laest sich reduzieren auf:
[img]http://www.rzuser.uni-heidelberg.de/~krichte4/pics/extpics/background1.jpg[/img]
Das ergibt, asl Hintergrund gesetzt, folgende Seite [url=http://www.rzuser.uni-heidelberg.de/~krichte4/pics/extpics/newnews/backtest.html]kllick mich[/url] - also genau das, was Du auch mit einer riesigen Grafik gemacht hast :D

EDIT: ich hab grade eben fesgestellt, das es genau das font face="MS sans serif" ist, was den Firefox abstuerzen laesst. Bitte bitte dringend aendern. Am besten durch css:
[code]
<style type="text/css">

</style>
[/code]
Einfach in jede Datei zwischen head und body packen. so kannst Du Dir die ganzen font-tags sparen, weil du die Farben und Schriftart/groesse so dateiweit festlegst.[/img]

So, das wars erstmal von mir :D
Hoffe, ich hab Dich nicht allzu sehr geschockt, vielleicht hilfts Dir ja, zum HTML-Meister aufzusteigen :lol:

Gruesse, kerri

tele	15.11.2004 18:43

sieht gut aus, aber ist imho ein wenig groß - die seite war bei mir fast 1,5MB

guck mal ob du die pics noch ein wenig komprimieren kannst oder weniger nimmst oder irgendwo sparst -

kerri

15.11.2004 18:55

[quote=telepornos]sieht gut aus, aber ist imho ein wenig groß - die seite war bei mir fast 1,5MB

guck mal ob du die pics noch ein wenig komprimieren kannst oder weniger nimmst oder irgendwo sparst -[/quote]

Wie bereits geschrieben liegt das am HG Bild - das ist EIN einziges grosses Bild von weit ueber 1MB. Das kann man dabei doch noch so schoen Kacheln :D

Leo, zu der verweisliste, schau dir mal [url=http://de.selfhtml.org/javascript/beispiele/verweisliste.htm] das hier [/url] bei selfhtml an. Das ist AFAIK auch nur mit JavaScript loesbar. Im Beispiel von Selfhtml wird die ausgewaehlte Seite auch noch in nem anderen Frame geaden, mit ein wenig fummelei bekommt man die auch in der aktuellen Seite geladen.
Dabei muesstest Du die parent.frames[1].location ersetzen durch window.location.href, wenn mich meine JavaScript-Kenntnisse nicht ganz taeuschen :D

Gruesse, kerri

LeoHart

15.11.2004 19:00

Ja das mit der Dynamik war auch so ne Sache wo ich lange am überlegen war.Bis ich mir dachte ich zerleg die Dinger so hab ich es teilweise dynamisch(was news Eintragen usw. angeht).Als ich dann die Größe eben auf groß gestellt habe ging das Desgin im Eimer deswegen auch oben"bitte in der Schriftgröße mittel darstellen lassen".Naja das mit der Schriftart oh man konnte ich nicht wissen.

Ja wie gesagt das Hintergrundbild ist 1Mb groß,doch mit kerris gutem Vorschlag wird sich das mal ändern.

Naja muss mal gucken wie ich das alles noch darein bringe*vielarbeit*

edit: jetzt wird es langsam kompliziert mit Javascript ect. da ich die Hp eigentlich nur mit html programmieren sollte.Da wir zu Javascript wohl nach der Kursarbeit kommen werden.

LeoHart

16.11.2004 20:10

Also deine Vorschläge werd ich mir mal nach den ganzen Kursarbeiten zu Herzen nehmen.Doch was ich nicht vestehe,zwischen den drei Teilen ist ja jedes mal ein Strich durchgezogen,wie wird der denn automatisch erweitert :?

Nur so als Anmerkung,heute hat mein Infolehrer die Hp gesehen und wollte mir zuerst nicht glauben das ich die allein gemacht habe(lag weniger am Design hat sich kurz mal den Quelltext angeguckt und meinte "oh man,hast du das alle mit Hand eingetippt?" ok einmal eingetippt und dann eben kopiert nur dei Mitte geändert :wink: ,bis ich dem gesagt habe das ich fast die ganzen Ferien da dran saß.
Ok ich meine hilfe von einem Forum ist ja nicht verboten :wink:

kerri

16.11.2004 20:44

Also der Strich an der Seite ist einfach nur dieses Bild:
[img]http://www.rzuser.uni-heidelberg.de/~krichte4/pics/extpics/newnews/linksback.gif[/img]
Was der Browser automatisch immer genuegend oft untereinander packt, da ich es mit style="background-image:url(rechtsback.gif)" im td-tag als Hintergrundbild definiert habe. obendrueber gelegt habe ich dann einfach dieses (natuerlich vorher auf die richtige groesse geschnittene) Bild:
[img]http://www.rzuser.uni-heidelberg.de/~krichte4/pics/extpics/newnews/rechtsmitte.gif[/img]
Per Valign="bottom" nach unten geschoben.
In der Tabellenzelle ist also nur ein einziges img-Element. Das andere ist ledigklich Hintergrund. Dabei wird die Breite der Zelle duch das breiteste Element festgelegt, in dem Fall 29 Pxl. Damit alles passt, sollte das HG Bild dann auch 29 Pxl Breite haben - und der Strich an der richtigen Stelle sein.
Speicher Dir am besten einfach die Seite, die ich zusammengebastelt habe, und spiele etwas damit rum, so lernt man meist am meisten ;)

Kann das sein, das Dir das Konzept von Hintergrundbildern noch nicht so ganz gelaeufig ist? Schau mal in selfhtml nach Hintergrundbildern.

So 100% per Hand hastes aber auch net gemacht, der HTML EDITOR phase 5.3 hat auch ein wenig geholfen ;)

Gruesse, kerri

Exit	18.11.2004 13:57

@kerri - Wahnsinn ich bin ja beeindruckt! Endlich mal jemand der Ahnung von der Materie hat - auch wenn er scheinbar etwas von der bösen Seite der Macht (Linux) angezogen wird ;-)

Alle Zeitangaben in WEZ +1. Es ist jetzt 05:14 Uhr.

Seite 1 von 2

60 Beiträge dieses Themas auf einer Seite anzeigen