Tabellenausrichtung
0 0 0 0 0 0 0 0 
at
Tabellenausrichtung
Abnd Allerseits,
ich hab ein Problem mit einer Ausrichtung einer Tabelle.
Zum veranschaulichen erstmal die HP soweit schon fertig:
http://b3njamin.b3.funpic.de/home.html
Die "Border"/Ränder der Tabelle habe ich nur zur Veranschaulichung stehen lassen. Das Problem ist nun, dass der Tabellenteil wo sich das Menü befindet so eine große Fläche einnimmt. Eigentlich sollte die Fläche nur so groß sein wie das Menü ist.
Meine Frage wäre nun, wie kann ich diese Einstellung ändern???
Der zugehörige Quellcode ist der oben angegebenen Adresse zu entnehmen (Rechtsklick -> Quelltext anzeigen).
Vielen dank für eure Hilfe.
lg benni
ps. schöne Pfingsttage
-
ich hab ein Problem mit einer Ausrichtung einer Tabelle.
ja
keine doctype und urlalt<center> und noch viel anderes....nun ja, da können wir doch etwas verbessern mit css
<style>
body { background-color:#fff; margin:0px }
/*damit kannst du die Attribute im <body entfernen */
table { margin: 0em auto 0em auto; width: 90%; }
/*oder welche weite dir lieber ist*/
</style>Nun zu deinem Problem
Die "Border"/Ränder der Tabelle habe ich nur zur Veranschaulichung stehen lassen.
OK
Das Problem ist nun, dass der Tabellenteil wo sich das Menü befindet so eine große Fläche einnimmt. Eigentlich sollte die Fläche nur so groß sein wie das Menü ist.
Nein denn du hast deiner Tabellenzelle die Breite zugewiesen
<td style="width:202px">Lösungsansatz: Gib eine Breite an, welche der Breite des enthaltenen Bildes 'menue.jpg' entspricht.
Ich halte es für wenig praktisch, das ganze Menu in einem Bild darzustellen und dann mit <area> zu arbeiten.
Wenn du einen neuen Menu-Eintrag brauchst, musst du schnell alles neu machen.Da wäre noch viel mehr zu sagen
mfg Beat
-
nun ja, da können wir doch etwas verbessern mit css
<style>
body { background-color:#fff; margin:0px }
/*damit kannst du die Attribute im <body entfernen */
table { margin: 0em auto 0em auto; width: 90%; }
/*oder welche weite dir lieber ist*/
</style>Ich habe HTML vor 6 Jahren "gelert" und mich danach nicht mehr damit beschäftigt...vllt kannste mir ja näherbringen was man noch alles verändern könnte/sollte.
Nein denn du hast deiner Tabellenzelle die Breite zugewiesen
<td style="width:202px">Lösungsansatz: Gib eine Breite an, welche der Breite des enthaltenen Bildes 'menue.jpg' entspricht.
Das Bild ist 202px Breit und egal wie ich die Breite veränder, da ändert sich garnichts an der Breite von dem Feld.
Ich halte es für wenig praktisch, das ganze Menu in einem Bild darzustellen und dann mit <area> zu arbeiten.
Wenn du einen neuen Menu-Eintrag brauchst, musst du schnell alles neu machen.Wie soll man das sonst machen?
Da wäre noch viel mehr zu sagen
Erzähl bitte...nehme Verbesserungsvorschläge immer gerne auf!
lg benni
-
Das Bild ist 202px Breit und egal wie ich die Breite veränder, da ändert sich garnichts an der Breite von dem Feld.
Etwas triviales.
Wenn ich am CSS etwas ändere, dann muss ich bei mir erst den Browser Cache (bei Firefox [ALT][X] P ) leeren, damit der Browser auch das geänderte neue CSS liest.Wenn du einen neuen Menu-Eintrag brauchst, musst du schnell alles neu machen.
Wie soll man das sonst machen?
Persönlich finde ich Schriftlinks immer noch die besten.
Irgendwann werden wir noch mehr Grafikfähigkeiten haben, welche wir im Browser direkt ansprechen können. Bis es soweit ist, sind mir Hintergrundbilder zu den Schriftlinks eigentlich ausreichend.Hier kommt ein kleiner Entwurf:
Braucht weniger CodeBei der DOCTYPE musst du einschreiben, was dir am ehesten entspricht
Hole dir die richtige Doctype immer von der offiziellen Stelle:
www.w3.org
Du musst diuch selbst entscheiden, ach welcher Norm dein Dokument valide sein soll
Ich empfehle dir die Variante Html 4.01 Transitional<!DOCTYPE ..............>
<html>
<head>
<style>
#main { width:400px; margin: 0 auto; }
/* Korrigiere es zur Breite deines Logo Bildes */
#head { }
#menu { float:left; width:202px; margin:0; padding:0}
#content { overflow:auto; }
/*Die Angabe bewirkt, dass Inhaltsbox
nicht um die Flowbox umgebrochen wird */
</style>
<title>Versuch</title>
</head>
<body><div class="main">
<div id="head">
<img src="http://b3njamin.b3.funpic.de/oben.jpg">
</div>
<div id="menu">
<!-- hier deine Links -->
</div>
<div id="content">
<p>Herzlich Willkommen auf el-maestro.de.vu</p>
</div>
</div></body>
</html>mfg Beat
-
Das Bild ist 202px Breit und egal wie ich die Breite veränder, da ändert sich garnichts an der Breite von dem Feld.
Etwas triviales.
Wenn ich am CSS etwas ändere, dann muss ich bei mir erst den Browser Cache (bei Firefox [ALT][X] P ) leeren, damit der Browser auch das geänderte neue CSS liest.1.Was ist trivial?
2.Ich hab zum einen das Browser Cache geleert und zum anderen die Schose mit Phase 5 ausprobiert...tuts leider trotzdem nicht.Bei der DOCTYPE musst du einschreiben, was dir am ehesten entspricht
Hole dir die richtige Doctype immer von der offiziellen Stelle:
www.w3.org
Du musst diuch selbst entscheiden, ach welcher Norm dein Dokument valide sein soll
Ich empfehle dir die Variante Html 4.01 TransitionalWas genau kann ich auf der Seite nachschauen und inwieweit bringt mich das weiter??
<!DOCTYPE ..............>
<html>
<head>
<style>
#main { width:400px; margin: 0 auto; }
/* Korrigiere es zur Breite deines Logo Bildes */
#head { }
#menu { float:left; width:202px; margin:0; padding:0}
#content { overflow:auto; }
/*Die Angabe bewirkt, dass Inhaltsbox
nicht um die Flowbox umgebrochen wird */
</style>
<title>Versuch</title>
</head>
<body><div class="main">
<div id="head">
<img src="http://b3njamin.b3.funpic.de/oben.jpg">
</div>
<div id="menu">
<!-- hier deine Links -->
</div>
<div id="content">
<p>Herzlich Willkommen auf el-maestro.de.vu</p>
</div>
</div></body>
</html>Ich habe den Code mal umgesetzt, aber weiterhin auf meine Grafik als Menü gesetzt. Problem hierbei: Es entsteht eine Spalte. Wie kann ich die wegbekommen.
Und insgesamt möchte ich die Page in der Mitte der Seite erscheinen lassen, soll ich das eingaf mit [center] zu machen oder anderswie?
Ausserdem soll der Textteil in der Mitte auf die Breite der "oben.jpg" gezwungen werden, wo gebe ich das an?
Hier die Aktualisierte Version:
http://b3njamin.b3.funpic.de/home_versuch.htmllg benni
-
Das Bild ist 202px Breit und egal wie ich die Breite veränder, da ändert sich garnichts an der Breite von dem Feld.
Hier die Aktualisierte Version:
http://b3njamin.b3.funpic.de/home_versuch.htmlSetze mal diese Doctype hinein
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">Ich habe sie von dieser Adresse kopiert:
http://www.w3.org/QA/2002/04/valid-dtd-list.htmlDann habe ich den blöden Fehler im Code geschrieben:
<div class=main>
sollte aber heissen
<div id=main>Dann hast du leider noch Fehler eingebaut
bzw. Ich habe Fehler übernommen.<img> Elemente _müssen_ ein alt Attribut haben
<img alt="Kurzbeschrieb des Bildes">in einem <p> Element darfst du kein weiteres Blockelement notieren
also kein <div> und auch kein <table><div id="menu">
<div id="d1">
<p>
<div style="padding-bottom:0em; border:0;">
<img src="http://b3njamin.b3.funpic.de/menue.jpg" usemap="#Menue" border="0"></div>
</div>
</p>
</div>Ist vollkommenen unnötiges Gerümpel.
Alles was du im <div id=menu> willst, ist dein <img>Und nimm das Attribut border aus dem <img>.
mfg Beat
-
Setze mal diese Doctype hinein
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">Ich habe sie von dieser Adresse kopiert:
http://www.w3.org/QA/2002/04/valid-dtd-list.html<img> Elemente _müssen_ ein alt Attribut haben
<img alt="Kurzbeschrieb des Bildes">ist das nicht nur damit ein Benutzer weiss was da stehen sollte wenn das Bild aus welchen Gründen auch immer nicht angezeigt wird oder kommt der Browser sonst in schwierigkeiten weil er nichts anzeigen kann?
in einem <p> Element darfst du kein weiteres Blockelement notieren
also kein <div> und auch kein <table>Darf ich fragen was das für Auswirkungen haben kann?
Und nimm das Attribut border aus dem <img>.
Habe ich schon ausprobiert, aber wenn ich das NICHT dazu schreibe erscheint um das Menue ein Blauer Dreieckieger Rand. (siehe: http://b3njamin.b3.funpic.de/home_versuch_mitRand.html)
Wie kann ich das Problem lösen?
Ausserdem habe ich noch eine andere generelle Frage: Und zwar muss ich nach dem aktuellen Stand meines Codes wenn ich ein neues Menüelemt hinzufügen will in allen Dokumenten (home, links, etc.) alles aktualisieren. Kann man es auch so einrichten dass das Menü in einem Dokument extra gespeichert wird und dann von den jeweiligen anderen Dokumenten (home, links, etc) aufgerufen wird? Wenn ich das Menü also änder wird es auch überall automatisch verändert. (IOch hoffe das war verständlich)
lg benni
-
ist das nicht nur damit ein Benutzer weiss was da stehen sollte wenn das Bild aus welchen Gründen auch immer nicht angezeigt wird oder kommt der Browser sonst in schwierigkeiten weil er nichts anzeigen kann?
Der Inhalt des alt Attributs wird angezeigt, wenn das Bild nicht erreichbar ist. Bilder stellen Hürden da für die zugänglichkeit. Deshalb wird empfohlen, Bilder auch mit einem title Attribut zu versehen.
Ok stell dir vor, das Bild stellt ein Logo dar. Ein typisches Markup wäre:
<img src="logo.png" alt="Homepage Logo" title="Das Logo zeigt einen Apfel in zwei Hälften">
Blinde sind eventuell froh, wenn sie sinnvolle Beschriftungen vorgelesen bekommen.Wenn das Bild eine ganze Geschichte erzählt, gibt es noch ein attribut longdesc (lange Besprechung)
longdesc="bildbeschreibungen.html"In einer speziellen Seite können die Bilder in Worten ausführlich beschrieben werden.
Google mal nach alt und longdesc
in einem <p> Element darfst du kein weiteres Blockelement notieren
also kein <div> und auch kein <table>Darf ich fragen was das für Auswirkungen haben kann?
Invalides HTML hat immer nicht kalkulierbare Auswirkungen.
Und nimm das Attribut border aus dem <img>.
Habe ich schon ausprobiert, aber wenn ich das NICHT dazu schreibe erscheint um das Menue ein Blauer Dreieckieger Rand. (siehe: http://b3njamin.b3.funpic.de/home_versuch_mitRand.html)Du kannst doch im <style> Bereich definieren:
img {border:0;}... Und zwar muss ich nach dem aktuellen Stand meines Codes wenn ich ein neues Menüelemt hinzufügen will in allen Dokumenten (home, links, etc.) alles aktualisieren. Kann man es auch so einrichten dass das Menü in einem Dokument extra gespeichert wird und dann von den jeweiligen anderen Dokumenten (home, links, etc) aufgerufen wird? Wenn ich das Menü also änder wird es auch überall automatisch verändert. (IOch hoffe das war verständlich)
Du meinst, ob du das Menu in einer separaten Datei speichern kannst und es dann einbinden kannst. Ja. Aber es ist keine gute Lösung.
Für den Stand deiner Kenntnisse halte ich es am Besten, wenn du die erste Seite baust, diese dann unbedingt validierst, bevor du das Ergebnis auf andere Seiten anwendest.So. Jetzt gehst du aber wieder zu Fuss.
mfg Beat
-
So. Jetzt gehst du aber wieder zu Fuss.
Soooo...das werd ich jetzt auch erstmal tuen ;)
Aber vielen vielen dank für die Unterstützung, hat mich in jedem Fall weiter gebracht!
Eine ganz kleien Frage hab ich noch: bist du hier öfters im Forum unterwechs? Falls ich weitere Fragen habe (kommen bestimmt irgentwann;)).
Eine E-Mail oder so etwas in der Richtung wäre natürlich auch höchst hilfreich falls ich mal eine Frage habe...Wäre nett. Wenn nicht...dann schreib ich halt wieder hier ins Forum :)
Schönen Restsonntag und ne schöne nächste Woche!
lg benni (Mail hab ich angegeben...)
-
-
Hallo.
Ausserdem habe ich noch eine andere generelle Frage: Und zwar muss ich nach dem aktuellen Stand meines Codes wenn ich ein neues Menüelemt hinzufügen will in allen Dokumenten (home, links, etc.) alles aktualisieren. Kann man es auch so einrichten dass das Menü in einem Dokument extra gespeichert wird und dann von den jeweiligen anderen Dokumenten (home, links, etc) aufgerufen wird? Wenn ich das Menü also änder wird es auch überall automatisch verändert. (IOch hoffe das war verständlich)
Du verwendest doch Phase 5. Dieses Programm beherrscht eine Technik namens Includes, mit deren Hilfe du Code-Schnipsel automatisch aktulisieren lassen kannst. Grundsätzlich ist so etwas zwar auch server-seitig möglich, aber befasse dich vielleicht zunächst mit den Grundlagen und deinen schon vorhandenen Werkzeugen, bevor du dich an die server-seitige Programmierung wagst.
MfG, at
-
-
-
-
-
-