nicht angemeldet
Breite der Tabellenspalte definieren (funktioniert nicht)
Guten Tag liebe Foren-Mitglieder,
ich schreibe seit langem mal wieder mit HTML. Ich möchte eine ganz einfache Internetseite aufbauen. Nun habe ich aber ein Problem mit der Definition der Spaltenbreite in einer Tabelle.
Das Problem liegt in der zweiten Tabelle. Da sich die Seite im Aufbau befindet, sind die Links natürlich zu den Unterseiten noch nicht final.
Ich möchte in der zweiten Tabelle in der zweiten Zeile (die erste ist nach oben hin ein Platzschaffer) und in der ersten Spalte eine Breite von 550px erzeugen. Da steht momentan "auf dem weg" drin. Nur ist die Spalte momentan nicht in der erwünschten Breite.
Ich habe versucht die Größe mit dem width="550px" und dem css-style-befehl style="width:550px" zu setzen, aber auch colgroup hat nicht funktioniert.
Bringt mich nun schon eine Weile zum grübeln.
Ich bitte also um Hilfe, wie ich zum gewünschten Ergebnis komme.
Hier das HTML:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=windows-1250">
<meta name="description" content="Webseite von Bjoern Giesecke">
<meta name="author" content="Bjoern Giesecke">
<meta name="keywords" content="photographie, design">
<title>bjoern giesecke</title>
<style type="text/css">
#fixiert { position:fixed; top:18px; left:20px; width:*px; height:*px; background-color:#; }
a:link { text-decoration:none; font-weight:normal; color:#000000; background-color:#FFFFFF; }
a:visited { text-decoration:none; font-weight:normal; color:#000000; background-color:#FFFFFF; }
a:hover { text-decoration:none; font-weight:normal; color:#FFFFFF; background-color:#000000; }
a:active { text-decoration:none; font-weight:normal; color:#000000; background-color:#FFFFFF; }
a:focus { text-decoration:none; font-weight:normal; color:#000000; background-color:#FFFFFF; }
</style>
</head>
<body style="background-image:url(bilder/deck.jpg); background-attachment:fixed; background-repeat:repeat; ">
<font face="Courier New" size="16">
<div id="fixiert">
<table width="550px" border="0" align="left">
<tr>
<td><a href="index.html">start</a></td>
<td><a href="#">information</a></td>
<td></td>
<td></td>
</tr>
<tr>
<td><a href="#">fotografien</a></td>
<td><a href="#">graphiken</a></td>
<td></td>
<td></td>
</tr>
<tr>
<td><a href="#">auf dem weg</a></td>
<td><a href="#">angst</a></td>
<td><a href="#">seensucht</a></td>
<td></td>
</tr>
</table>
</div>
<table cellspacing="-10px" cellpadding="-10px">
<tr style="height:115px"></tr>
<tr>
<td style="width:550px" align="center" valign="center"><font style="text-decoration:none; font-weight:normal; color:#FFFFFF; background-color:#000000; ">auf dem weg</font></td>
<td><img src="bilder/aufdemweg/rollei-retro-255.jpg"></td>
<td><img src="bilder/aufdemweg/rollei-retro-257.jpg"></td>
<td><img src="bilder/aufdemweg/rollei-retro-262.jpg"></td>
<td><img src="bilder/aufdemweg/rollei-retro-210.jpg"></td>
<td><img src="bilder/aufdemweg/rollei-retro-256.jpg"></td>
<td><img src="bilder/aufdemweg/rollei-retro-302.jpg"></td>
<td><img src="bilder/aufdemweg/apx400-052.jpg"></td>
<td><img src="bilder/aufdemweg/fomaPAN400-32.jpg"></td>
<td><img src="bilder/aufdemweg/fomaPAN400-39.jpg"></td>
<td><img src="bilder/aufdemweg/fomaPAN400-31.jpg"></td>
</tr>
</table>
</font>
</body>
</html>
Wenn ihr allgemeine Verbesserungen für meinen Code habt, würde ich mich freuen.
Viele Grüße,
Björn
-
Hello,
siehe http://de.selfhtml.org/navigation/css.htm#tabellen
Liebe Grüße aus dem schönen Oberharz
Tom vom Berg
-
Hallo nochmal,
ich habe
<table style="table-layout:fixed" .. >und auch das<td style="width:550px" ...>übernommen.Es funktioniert jedoch immer noch nicht.
-
Hello,
Hallo nochmal,
ich habe
<table style="table-layout:fixed" .. >und auch das<td style="width:550px" ...>übernommen.... und auch auf deinen Webserver hochgeladen?
Es funktioniert jedoch immer noch nicht.
Dann musst Du uns z.B. mal einen Link zu Seite geben, damit wir gucken können.
Liebe Grüße aus dem schönen Oberharz
Tom vom Berg
-
Hello,
»»
... und auch auf deinen Webserver hochgeladen?
Ja, klar ;)
Aktuelles HTML
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <meta http-equiv="content-type" content="text/html; charset=windows-1250"> <meta name="description" content="Webseite von Bjoern Giesecke"> <meta name="author" content="Bjoern Giesecke"> <meta name="keywords" content="photographie, design"> <title>bjoern giesecke</title> <style type="text/css"> #fixiert { position:fixed; top:18px; left:20px; width:*px; height:*px; background-color:#; } a:link { text-decoration:none; font-weight:normal; color:#000000; background-color:#FFFFFF; } a:visited { text-decoration:none; font-weight:normal; color:#000000; background-color:#FFFFFF; } a:hover { text-decoration:none; font-weight:normal; color:#FFFFFF; background-color:#000000; } a:active { text-decoration:none; font-weight:normal; color:#000000; background-color:#FFFFFF; } a:focus { text-decoration:none; font-weight:normal; color:#000000; background-color:#FFFFFF; } </style> </head> <body style="background-image:url(bilder/deck.jpg); background-attachment:fixed; background-repeat:repeat; "> <font face="Courier New" size="16"> <div id="fixiert"> <table width="550px" border="0" align="left"> <tr> <td><a href="index.html">start</a></td> <td><a href="#">information</a></td> <td></td> <td></td> </tr> <tr> <td><a href="#">fotografien</a></td> <td><a href="#">graphiken</a></td> <td></td> <td></td> </tr> <tr> <td><a href="#">auf dem weg</a></td> <td><a href="#">angst</a></td> <td><a href="#">seensucht</a></td> <td></td> </tr> </table> </div> <table style="table-layout:fixed" cellspacing="-10px" cellpadding="-10px"> <tr style="height:115px"></tr> <tr> <td style="width:550px" align="center" valign="center"><font style="text-decoration:none; font-weight:normal; color:#FFFFFF; background-color:#000000; ">auf dem weg</font></td> <td><img src="bilder/aufdemweg/rollei-retro-255.jpg"></td> <td><img src="bilder/aufdemweg/rollei-retro-257.jpg"></td> <td><img src="bilder/aufdemweg/rollei-retro-262.jpg"></td> <td><img src="bilder/aufdemweg/rollei-retro-210.jpg"></td> <td><img src="bilder/aufdemweg/rollei-retro-256.jpg"></td> <td><img src="bilder/aufdemweg/rollei-retro-302.jpg"></td> <td><img src="bilder/aufdemweg/apx400-052.jpg"></td> <td><img src="bilder/aufdemweg/fomaPAN400-32.jpg"></td> <td><img src="bilder/aufdemweg/fomaPAN400-39.jpg"></td> <td><img src="bilder/aufdemweg/fomaPAN400-31.jpg"></td> </tr> </table> </font> </body> </html>Es funktioniert jedoch immer noch nicht.
Könnte es sein, das der
style:table-layout:fixedauf die Gesamtbreite des Bildschirms geht? Ich möchte eine fortlaufende horizontale Tabellezeile, bei der die erste Spalte 550px breit ist und sich die anderen Spaltenbreiten nach der img-Breite richten.Der Link ist der oben angegebene: http://homepage.alice.de/burean/index.html
Viele Grüße,
Björn-
Hi,
Der Link ist der oben angegebene: http://homepage.alice.de/burean/index.html
Fehler beseitigen, dann sehen wir weiter.
MfG ChrisB
--
RGB is totally confusing - I mean, at least #C0FFEE should be brown, right?-
Der Link ist der oben angegebene: http://homepage.alice.de/burean/index.html
Fehler beseitigen, dann sehen wir weiter.
Guten Mittag,
Fehler sind bei Transitional jetzt keine mehr. Zu dem fehlerfreien Strict fehlt mir die Ahnung mit dem Umgang von Schrifteinbindung, vielleicht mit Container. Für HTML5 hab ich auch ein paar Fehler gestrichen. Das meiste war ja in CSS umschreiben.
Mein Ausgangsproblem funktioniert jedoch immer noch nicht.
Sollte ich jetzt nochmal dastable-layout:fixedund dietd-widtheinfügen?Aktuelles HTML:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <meta http-equiv="content-type" content="text/html; charset=windows-1250"> <meta name="description" content="Webseite von Bjoern Giesecke"> <meta name="author" content="Bjoern Giesecke"> <meta name="keywords" content="photographie, design"> <title>bjoern giesecke</title> <style type="text/css"> #fixiert { position:fixed; top:18px; left:20px; width:*px; height:*px; background-color:#; } a:link { text-decoration:none; font-weight:normal; color:#000000; background-color:#FFFFFF; } a:visited { text-decoration:none; font-weight:normal; color:#000000; background-color:#FFFFFF; } a:hover { text-decoration:none; font-weight:normal; color:#FFFFFF; background-color:#000000; } a:active { text-decoration:none; font-weight:normal; color:#000000; background-color:#FFFFFF; } a:focus { text-decoration:none; font-weight:normal; color:#000000; background-color:#FFFFFF; } .intro {text-decoration:none; font-weight:normal; color:#FFFFFF; background-color:#000000; } </style> </head> <body style="background-image:url(bilder/deck.jpg); background-attachment:fixed; background-repeat:repeat; font-family:'Courier New',Courier,serif; font-size:16; "> <div id="fixiert"> <table style="width:550px; border:0px; text-align:left; "> <tr> <td><a href="index.html">start</a></td> <td><a href="#">information</a></td> <td></td> <td></td> </tr> <tr> <td><a href="#">fotografien</a></td> <td><a href="#">graphiken</a></td> <td></td> <td></td> </tr> <tr> <td><a href="#">auf dem weg</a></td> <td><a href="#">angst</a></td> <td><a href="#">seensucht</a></td> <td></td> </tr> </table> </div> <table cellspacing="-10px" cellpadding="-10px"> <tr style="height:115px"><td></td></tr> <tr> <td style="width:550px; align:center; valign:middle; "><font class="intro">auf dem weg</font></td> <td><img src="bilder/aufdemweg/rollei-retro-255.jpg" alt="adw"></td> <td><img src="bilder/aufdemweg/rollei-retro-257.jpg" alt="adw"></td> <td><img src="bilder/aufdemweg/rollei-retro-262.jpg" alt="adw"></td> <td><img src="bilder/aufdemweg/rollei-retro-210.jpg" alt="adw"></td> <td><img src="bilder/aufdemweg/rollei-retro-256.jpg" alt="adw"></td> <td><img src="bilder/aufdemweg/rollei-retro-302.jpg" alt="adw"></td> <td><img src="bilder/aufdemweg/apx400-052.jpg" alt="adw"></td> <td><img src="bilder/aufdemweg/fomaPAN400-32.jpg" alt="adw"></td> <td><img src="bilder/aufdemweg/fomaPAN400-39.jpg" alt="adw"></td> <td><img src="bilder/aufdemweg/fomaPAN400-31.jpg" alt="adw"></td> </tr> </table> </body> </html>Viele Grüße,
Björn
-
-
-
-
-
-
Grüße dich, bjoern,
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">Du befindest dich im Quirksmode, da kannst du nichts erwarten.
Außerdem verwendest du Tabellen zur Darstellung, damit haben vernünftige Autoren vor etwa einem Jahrzehnt aufgehört. Folge doch bitte diesem Beispiel :)
Gruß, Daniel
-
Link: http://homepage.alice.de/burean/index.html
Hey Daniel,
kommt dieser Modus zum abwärtskompatiblen durch die "transitional"-Auszeichung?
Müsste ich in den "strict"-Modus?
Wenn Tabelle alt sind, was ist dann neu? Wie kann ich den Aufbau der Internetseite genauso schreiben?
Viele Fragen ...
Grüße,
Björn-
kommt dieser Modus zum abwärtskompatiblen durch die "transitional"-Auszeichung?
Ja.
Müsste ich in den "strict"-Modus?
Der Modus heißt Standardkonformer Modus, aber ja, die Variante Strict ist empfehlenswert.
Wenn Tabelle alt sind, was ist dann neu? Wie kann ich den Aufbau der Internetseite genauso schreiben?
Tabellen sind nicht alt, man verwendet sie für tabellarische Daten. Du jedoch, hast ein Menü (Liste) und andere Inhalte.
Zunächst schreibst du deine Inhalte zusammen und strukturierst sie mit Hilfe der zur Verfügung stehenden Elemente. Wenn du das getan hast, und wirklich erst dann, gestaltest du die Elemente mit Hilfe von Stylesheets. Die bieten zahlreiche Möglichkeiten zur Anordnung und Darstellung.
Gruß, Daniel
-
Hallo,
Der Modus heißt Standardkonformer Modus, aber ja, die Variante Strict ist empfehlenswert.
In dem befinde ich mich jetzt. Mit dem W3C Validator kommen jedoch beim
font-tagHinweise. Gibt es da eine einfachere CSS-Umschreibung mit der ich diestyle-Anweisungnicht in einemtable-tagoderp-tagsetzen kann? Also wie dasfont-tagvor und hinter dem Geschriebenen. Das zum einen.Tabellen sind nicht alt, man verwendet sie für tabellarische Daten. Du jedoch, hast ein Menü (Liste) und andere Inhalte.
Ich habe bisher alle meine Seiten mit Tabellen strukturiert, also ist das hier für mich eine echte Umstellung. Ich verstehe aber was du meinst und da hast du nicht Unrecht. Daher habe ich meine Seite etwas umgestellt. Komme jetzt aber so gut wie kaum voran. Ich denke meine fixierte Menü-Tabelle oben, die immer mitgescrollt wird kann ich als Tabelle lassen, oder?
Zunächst schreibst du deine Inhalte zusammen und strukturierst sie mit Hilfe der zur Verfügung stehenden Elemente. Wenn du das getan hast, und wirklich erst dann, gestaltest du die Elemente mit Hilfe von Stylesheets.
Die bieten zahlreiche Möglichkeiten zur Anordnung und Darstellung.
Könntest du mir eine Hilfe geben, wie ich meine vormals 2. Tabelle neu strukturiere. Ich möchte ja die zuerst etwas schreiben können mit einer definierbaren (funktionierenden) Breite und danach sollen die Bilder horizontal angelegt werden.
Könnte ich zweiteres eventuell mit einemfloat:leftbei den Bildern erreichen?Viele Grüße,
Björn-
Hallo,
In dem befinde ich mich jetzt. Mit dem W3C Validator kommen jedoch beim
font-tagHinweise. Gibt es da eine einfachere CSS-Umschreibung mit der ich diestyle-Anweisungnicht in einemtable-tagoderp-tagsetzen kann? Also wie dasfont-tagvor und hinter dem Geschriebenen. Das zum einen.Das font-Element ist veraltet, du darfst es deshalb nicht mehr verwenden. Defineire die gewünschte Schriftformatierung einmal für das html-Element und du bist sorgenfrei.
Im Standardkonformen Modus vererben sich Schriftformatierungen ganz normal in eine Tabelle hinein.
Du möchtest dich vermutlich mit Selektoren beschäftigen :)
Studiere insbesondere die Typselektoren und die Möglichkeit nachfahren zu selektieren. Eine geschickt eingesetze ID ist auch oft hilfreich (z.B. #navigation). Von zu vielen Klassen und IDs solltest du jedoch Abstand halten, die sind ungesund.
Ich habe bisher alle meine Seiten mit Tabellen strukturiert, also ist das hier für mich eine echte Umstellung. Ich verstehe aber was du meinst und da hast du nicht Unrecht. Daher habe ich meine Seite etwas umgestellt. Komme jetzt aber so gut wie kaum voran. Ich denke meine fixierte Menü-Tabelle oben, die immer mitgescrollt wird kann ich als Tabelle lassen, oder?
Es ist am Angang gewöhnungsbedürftig, aber später wirst du die vielseitigen Möglichkeiten nicht mehr missen wollen.
Manü-Tabelle? Nein, es handelt sich um eine Liste von Links, also eine (ungeordnete) Liste, keine Tabelle. Mit den richtigen Formaten für die ul- und li-Elemente (display, width) kannst du den selben Effekt mit weniger HTML realisieren.
Könntest du mir eine Hilfe geben, wie ich meine vormals 2. Tabelle neu strukturiere. Ich möchte ja die zuerst etwas schreiben können mit einer definierbaren (funktionierenden) Breite und danach sollen die Bilder horizontal angelegt werden.
Nein, nein, nein. Erst Inhalte strukturieren, nacher erst über die Darstellung nachdenken. Mit CSS kannst du jedes Element beleibig formatieren, mach dir also um die Darstellung keine Gedanken.
Sollte später dennoch ein zusätzliches Element erforderlich sein, ist das auch kein Beinbruch.Zunächst machst du aus deinem Menü eine Liste. Hmm, aus der Bilderreihe würde ich auch eine Liste machen (und vergib bessere Alternativtexte).
Könnte ich zweiteres eventuell mit einem
float:leftbei den Bildern erreichen?Float halte ich für zu komplex für deine Fähigkeiten, display: inline-block scheint mir da geeigneter.
Viel Erfolg.
-
-
-
-