Tabellenhöhe 100 % - Das ewig "unlösbare" Problem?
Hallo. Vor bestimmt 10 Jahren hatte ich das gleiche Problem, und da ich jetzt gerade einmal wieder HTML brauche, stellt es sich mir wieder in den Weg.
Das Problem: Ich will einen farbigen Balken in eine Webseite einfügen, dessen Höhe sich dem Browserfenster anpasst, also 100 %, so wie bei der Breite.
Ich weiß, dass das nur mit HTML-Tabellen nicht geht, deswegen habe ich es mit CSS probiert:
<style type="text/css">
html, body { background-color:#E0E0E0;
height: 100%;
margin: 0px;
padding: 0px;
}
div#content {
float:right;
min-height: 100%;
}
div.clear {
clear: both;
height: 0;
margin: 0;
padding: 0;
line-height: 0;
font-size: 0;
}
</style>
<table border="0" width="100%" cellpadding="0" cellspacing="0" height="100%" bgcolor="#FFFF00">
<tr>
<td> </td>
</tr>
</table>
Zwei Probleme:
1. Ich weiß nicht, was von dem Kram da oben ich weg lassen kann.
2. Obwohl da überall 100 % steht, funktioniert es nicht!!! Die Tabelle geht zwar in der Breite bis an die Ränder, aber nicht in der Höhe, das sind es nur 20 Pixel oder so...
Weiß hier jemand eine Lösung? Ich bin es echt leid...
Gruß,
Tiger53
Antwort schreiben
Antwort 1 von KJG17 vom 14.08.2020, 19:11 Options
Hallo Tiger53,
dieser Teil ergibt eine vollständig mit Gelb gefüllte Seite, die Ursache dafür, dass bei dir nur eine Höhe von ca. 20 Pixeln angezeigt wird liegt also nicht dort.
Wenn du ernsthaft vor hast dich mit CSS zu befassen, solltest du dir die deutschsprachige Referenz herunterladen.. -->
CSS 4 YouGruß
Kalle
Antwort 2 von Rado vom 14.08.2020, 20:04 Options
kannst du mal genauer definieren, was du als Balken haben willst, oder mehr vom Code preisgeben, denn der obige generiert nur eine volle gelbe Seite.
Antwort 3 von Tiger53 vom 14.08.2020, 23:41 Options
Hallo, danke erstmal dass Ihr geantwortet habt!
DIe Sache ist die - Geht mal auf die folgende Seite:
bilbosblog.blogspot.com
Das Problem ist auf der rechten Seite - der gelbe Balken dort soll eben bis nach unten gehen, so weit die Posts eben reichen, nicht mehr und nicht weniger weit.
Es fällt mir ehrlich gesagt schwer mich wegen so einer Kleinigkeit gleich komplett mit CSS zu befassen - denn eigentlich bin ich nur ein Meister darin, Quellcodes von irgendwo zu kopieren und sie dann meinen Wünschen anzupassen ;-)
Wenn Ihr also Ideen habt, bitte bitte :-)
Gruß,
Tiger53
Antwort 4 von Tiger53 vom 14.08.2020, 23:43 Options
SORRY - Falscher Link!!!
Hier der richige Link:
http://bilbosdiary.blogspot.com/
Antwort 6 von sutadur vom 15.08.2020, 07:04 Options
Zitat:
Ich weiß, dass das nur mit HTML-Tabellen nicht geht ...
Soweit ich mich erinnere, gehört auch das zu den Dingen, die sich mit Tabellen weitaus einfacher umsetzen lassen als mit CSS ... ;o) Aber probier erstmal die o.g. Vorschläge bzw. Links aus, mit CSS ist das auf jeden Fall der zeitgemäßere Weg.
Antwort 7 von Tiger53 vom 15.08.2020, 08:04 Options
Hallo an alle,
vielen Dank bis jetzt schon mal für Eure Hilfe!
Ich hab das Problem immer noch nicht ganz gelöst. Zwar konnte ich aus einigen der Beispielseiten den CSS-Quelltext übernehmen, das Problem ist immer nur - wie binde ich ihn so ein, dass sich das ganze nur auf die Tabelle bezieht und nicht gleich auf die gesamte Seite?
Bei BLOGGER hat man halt auf der rechten Seite sogenannte "Gadgets" - eins davon ist eben das einfügen von HTML/CSS. Die Gadgets werden alle untereinander gesapelt, also:
- Archiv
- HTML/CSS
- z.B. Bild
- usw. ...
Mit dem von oben klappt es immer noch nicht, da auch das eine Seite ist, wo nicht der GESAMTE Quelltext, also mit CSS im HEADER, zur Verfügung steht. Ich würd's halt gerne mal als ganzes sehen...
Noch mehr Tipps?
Gruß,
Tiger53
Falls jemand nochmal schauen will:
http://bilbosdiary.blogspot.com
Der gelbe Kasten soll bis nach unten gehen...
Antwort 8 von Tiger53 vom 15.08.2020, 08:24 Options
Hi nochmal, jetzt hab ich das eigentliche PROBLEM erkannt! ;-)
Also: Die Tabelle soll keinen Text enthalten. Die Höhe der Tabelle soll sich nur danach richten, was sich links von ihr abspielt, sprich, je mehr Posts auf der linken Seite sind, desto länger wird auch die Tabelle (sie wandert einfach immer bis zum Seitenende mit).
Vorschläge?
>>> http://bilbosdiary.blogspot.com
Gemeint ist der gelbe Balken rechts...
Vielen Dank!
Gruß,
Tiger53
Antwort 9 von Rado vom 15.08.2020, 09:01 Options
häng mal <td rowspan="999"> nach <td> </td> ein
Antwort 10 von Tiger53 vom 15.08.2020, 09:29 Options
Da tut sich nix...
Ich glaube, das Problem ist - egal was ich für einen Code in dieses "Widget" an der rechten Seite einfüge - die REGELN für Tabellen etc. ... werden ganz woanders festgelegt, von daher interessiert den der CSS-Code, den ich da noch einfüge, überhaupt nicht.
Habe auch mal probiert, über die Option "HTML bearbeiten" irgendetwas in der gesamt-übergreifenden XML-Datei zu ändern, aber ich hab ja überhaupt keine Ahnung davon ;-)
Meine letzte Rettung seid jetzt Ihr, denn ich komme mit logisch denken nicht mehr weiter - mir fehlen die Grundlagen! Und ich habe keine Zeit, mir die für so eine kleine Sache alle anzueignen...
Hier ist der Deal:- Geht zu
www.blogger.com- User = mm84@gmx.net
- Passwort = Schokolade
Es gibt ja bis jetzt nur einen Blog dort, da einfach auf "Layout" und dann "HTML bearbeiten".
Wer es als Erster schafft, den gelben Balken bis zum Ende der Seite laufen zu lassen (und mir dann noch sagt wo ich dann die Farbe ändern kann) der bekommt von mir
ein Päckchen Schokolade zugeschickt, kein Witz.
Wenn ich mich jetzt weiter daran versuche, werde ich noch wahnsinnig...
Besten Dank schon mal,
Euer
Tiger53
Antwort 11 von Rado vom 15.08.2020, 09:45 Options
- User = mm84@gmx.net
- Passwort = Schokolade
gibt bei blogger.com nur Fehlermeldung
Was willst du damit bezwecken ???
Antwort 12 von Tiger53 vom 15.08.2020, 09:49 Options
Hi,
anscheinend spielt Groß/Kleinschreibung eine Rolle...
also:
User = mm84@gmx.net
Passwort = schokolade
Danke für den Hinweis.
Gruß,
Tiger53
Antwort 13 von Rado vom 15.08.2020, 10:34 Options
auf die Schnelle mal mit einem workaround,
die Farbe kannst du ändern indem du #FFFF00 mit anderen ersetzt,
entweder Nrn. aus einem Grafikprog oder selber probieren:
die Werte sind die HexZahlen für Rot Grün und Blau, FF ist der höchste Wert, wenn du rot willst wäre das also FF0000 ...
Antwort 14 von Tiger53 vom 15.08.2020, 10:39 Options
Hi,
sorry, aber das ist gemogelt ;-) Du hast die Höhe der Tabelle auf 2500 festgesetzt. Wenn jetzt noch mehr Postings auf der linken Seite dazu kommen, dan bleibt die Tabelle bei 2500 - und ist wieder zu kurz...
Ich will ja, dass sie "mitwächst", je nachdem, wie lang die Seite ist...
Gruß,
Tiger53
Antwort 15 von Tiger53 vom 15.08.2020, 23:32 Options
So, und das soll es dann gewesen sein, hmm?
Keiner Lust, sich Schokolade zu verdienen?
Ich schicke sonst auch Gummibärchen...
Anybody? Die Zugangsdaten gelten noch.
Hier kann man alles einsehen:
http://www.blogger.com/html?blogID=2658092962972833507&tpl=trueLogin: mm84@gmx.net
Passwort: schokolade
Bitte bitte bitte bitte bitte..............
Antwort 16 von Rado vom 16.08.2020, 10:05 Options
hallo, hab zwar keine Lust auf Schokolade, aber den Quellcode als ganzes mal durch einen Validator geschickt, der meckert heftig, als gravierend meint er:
<style id='page-skin-1' type='text/css'><!—
The "id" attribute is not valid for the "style" element. Some valid attributes for this element are: "dir", "disabled", "lang", "media", "title", and "type".
und
<style type="text/css">
The "style" element cannot be used here. It is not contained in an element that allows its use. This element may be contained in "head".
Ich nehm an, das Problem, dass bei den tables die heigth Angabe nicht zieht kommt daher, bzw. irgendwo hast du auch in height Angaben ..px drinnen, das mögen die tables auch nicht.
Änder das mal und mach nach "" ein Leerzeichen und für XHTML auch immer ein / zu <p> und <br> (da hängen paar offene rum, deswegen hat mich der Validator am Anfang mit "too many errors" mal rausgeschmissen.
Gruß Rado
Antwort 17 von Tiger53 vom 16.08.2020, 14:19 Options
Alles Quatsch, mein erste Quellcode war ja auch viel zu kompliziert... Habe jetzt das hier:
<html>
<head>
<style type="text/css">
* {/* set all to 0 */
margin: 0;
padding: 0;
}
</style>
</head>
<body>
<table border="0" width="100%" cellpadding="0" cellspacing="0" height="100%" bgcolor="#FFFF00">
<tr>
<td> </td>
</tr>
</table>
</body>
</html>
Du wirst sehen, wenn Du das ganz normal öffnest, dann ist die komplette Seite gelb. So soll es ja auch sein: Eine Tabelle, die alles ausfüllt, was es auszufüllen gibt...
Nur bei BLOGGER sieht die Sache anders aus, weil da ist der Quellcode ja eingebettet in eine komplett fertige Seite, und ich weiß eben nicht, wo ich da die Regeln festsetzen soll.
Naja, werd das Projekt wohl einfach beenden.