gwt-celltable
height ist nicht die beste Lösung, wenn der Inhaltstext entweder vergrößert oder verkleinert werden soll. Es gibt also zwei Fälle, um das obige Beispiel wie folgt zu machen.
A) Verwendung von reinem CSS. B) Verwenden von Javascript
Erklärung A: In CSS hängen wir von zwei weiteren Dingen ab, ob wir die DIV-Struktur verwenden oder die TABLE-Methode verwenden.
A.1 Mit DIV:
Wenn wir die div-Struktur verwenden, um meine Seite zu erstellen, verwende ich line-height, um den Text vertikal auszurichten, und text-align, um den Text horizontal auszurichten.
A.2 Verwendung der Tabelle: Wenn ich Methodentabelle verwende, möchte ich den Text in der Mitte der Zelle zentrieren. Dieses Wunder wird genau dann gelten, wenn ich Text vertikal ausrichten: Mitte und horizontal ausrichten: Mitte. Hinweis: Der Text sollte im Tag geschrieben werden.
CSS im Textkörper als:
Ich liebe Allah Ich liebe islam
B: Verwenden von Javascript
Verwenden Sie min-height in der td und verwenden Sie die Funktionen "Vertikale Ausrichtung" und "Textausrichtung", um die Texte um die x- bzw. y-Achse zu zentrieren und zu zentrieren. Aber es gibt nur ein Problem, es wird einen Fehlerbericht in IE6, 7 erstellen, weil IE7, IE8 Min-Höhe nicht verstehen. Also haben wir IE9.js Datei, die Sie mit Google herunterladen. und legen Sie das Skript in den Kopf des HTML-Dokuments. Legen Sie auch die neueste jQuery-Datei zuerst und dann das IE9.js-Skript nach.
und in css genießen Sie die Eigenschaft min-height und wie weit Ihr Text wächst, der Text wird automatisch in der Mitte der Tabellenzellen sein.
Wenn Sie DIV verwenden, ist es der gleiche Prozess.
Ich hoffe, das wird dir etwas extra machen. Und Sie müssen Google nicht noch einmal verwenden. Wenn du es nicht verstehst, frag mich nochmal. Ich antworte Ihnen mit verschiedenen Ton mit jfiddle Beispiel. Danke liebe. :)
Zuerst machen Sie einen CSS Reset? Der folgende Post bezieht sich auf das gleiche Problem, denke ich. Warum wird die Boxgröße auf grenz- Box für Tabellen in Firefox?
Das Problem könnte durch den Unterschied zwischen Browsern in der Art und Weise verursacht werden, wie das Box-Modell gehandhabt wird. Lesen Sie diesen Beitrag , um weitere Informationen zu erhalten.
Ich würde die Box-Sizing-Eigenschaft festlegen. Der IE verwendet die border-box, jeder andere Browser das content-box-Modell. Sie können festlegen, welche mit der folgenden CSS-Regel verwendet werden soll:
%Vor%oder
%Vor%Wir haben manchmal Probleme damit, dass das IE das Layout bricht, weil die Seite gerendert wird, bevor alles fertig ist. Versuchen Sie es, wenn Sie einem Element im DOM eine Dummy-CSS-Klasse zuweisen.
Wenn dies der Fall ist, könnte Ihnen der folgende Code helfen. Es setzt nur eine zufällige Klasse auf das body-Element und setzt es zurück, um ein erneutes Rendern der Seite zu erzwingen:
%Vor%Wie erhöht man die Zellhöhe der GWT-Cable-Tabelle?
In mozilla firefox Zelle Höhe richtig (nach Inhalt), aber im Falle von Internet Explorer einige Teile des Inhalts nicht richtig angezeigt
siehe Bild
Meine Celltable.css ist wie folgt:
%Vor%Welche Änderungen muss ich in CSS vornehmen, um Konsistenz (Zellenhöhe) in allen Browsern zu erreichen?
Ich denke, das Problem könnte darin bestehen, dass Ihr CSS-Stil für die Zelle "overflow: hidden" hat.
%Vor%Nimm das weg und schau was passiert. Ich denke, die Zelle und Zeile wird sich erweitern, um den Inhalt anzupassen.
Es gibt eine weitere mögliche Korrektur für das CSS von cellTableRow. Zeilenstile sollten durch Zellenstile überschrieben werden, aber GWT unternimmt unter Umständen etwas, um Browserunterschiede in IE auszugleichen. Um sicherzustellen, dass immer für die TDs gilt, die im TR enthalten sind, schreiben Sie es wie folgt:
%Vor%verwende dies
%Vor%Sie können
verwenden %Vor%Es funktioniert für mich:)
%Vor%Erweitern Sie AbstractCellTableBuilder und erwähnen Sie dann das Höhenattribut von TableRow