Feste Höhe der Kopfzeile und der Zeilen in GWT cellTable

Question

Wie kann ich die Höhe der Zeile und die Kopfzeile fest, wenn die Höhe der cellTable z.B. 200px festgelegt ist?

In meinem Fall werden die Kopfzeile und die Zeile jedes Mal, wenn ein Inhalt hinzugefügt oder entfernt wird, automatisch in der Größe angepasst.

Ich habe mein CSS wie folgt definiert:

`.cellTableHeader { border-bottom: 2px solid #6f7277; padding: 3px 15px; text-align: left; color: #4b4a4a; text-shadow: #ddf 1px 1px 0; overflow: hidden; height: 25px; }

.cellTableCell {
    padding: 4px;
    overflow: hidden;
    font-size: 10px;
    font-family: ARIAL;
    height: 25px;
}

.cellTableEvenRow {
  background: #ffffff;
  height: 25px;
}

.cellTableOddRow {
  background: #f3f7fb;
   height: 25px;
}` 

Ich habe auch die cellTable#setColumnWith() .

Irgendeine Idee?

[1]: http://i.stack.imgur.com/Vd2Hp.png ![Bildbeschreibung hier eingeben][1]

Answer 1

Ok, vielleicht war meine Frage anfangs nicht gut gestellt :( aber ich habe mein Problem gelöst. Was ich vorhatte, ist eine feste Tabelle (mit Umgebung), in der ich meine Elemente platzieren kann, ohne dass die Änderung der Anzahl der Elemente die Anzeige der Tabelle selbst beeinflusst. Also, um dieses Verhalten zu haben, habe ich nicht eine feste Höhe auf die Zelle Tabelle (da das nicht funktioniert), aber ich habe das Loch Tabelle in einem vertikalen Panel mit definierten boder-Stil und verwalten die Anzeige der cellTable mit seinen css.

VerticalPanel contentPanelVP = getContentPanel();
contentPanelVP.add(this.trainerConfigurationTable);

    /**
     * Gets the panel that represents the surroundings 
     * 
     * @return configured vertical panel
     */
    private VerticalPanel getContentPanel() {
        VerticalPanel tableContentVP = new VerticalPanel();
        tableContentVP.setVerticalAlignment(HasVerticalAlignment.ALIGN_TOP);
        tableContentVP.setStyleName(CSS_TRAINING_BOX_CONTENT);
        tableContentVP.setWidth(CONTENT_PANEL_WIDTH);
        tableContentVP.setHeight(CONTENT_PANEL_HEIGHT);
        return tableContentVP;
    }

CSS

.tableContentVP{
    border-width: 1px;
    border-style: solid;
    border-color: grey;
    padding: 0px;
    background-color: white;
}

Tabelle CSS

@def selectionBorderWidth 2px;
.cellTableWidget { 
}

.cellTableFirstColumn {
    height: 25px;
}

.cellTableLastColumn {

}

.cellTableFooter {
}

.cellTableHeader {
    padding: 0px;
    text-align: center;
    font-size: 10px;
    font-family: ARIAL;
    font-weight: bold;
    color: white;
    text-shadow: 0 1px 1px rgba(255, 255, 255, .7);
    background-image: none;
    background-color: black;
    height: 25px;
    vertical-align: middle;
}

.cellTableCell {
    padding: 4px;
    overflow: hidden;
    font-size: 10px;
    font-family: ARIAL;
    text-align: center;
}

.cellTableSortableHeader {
    cursor: pointer;
    cursor: hand;
}

.cellTableEvenRow {
    background: #ffffff;
    height: 25px;
    cursor: pointer;
    cursor: hand;
}

.cellTableEvenRowCell {
    border: selectionBorderWidth solid #ffffff;
}

.cellTableOddRow {
    background: #f3f7fb;
    height: 25px;
    cursor: pointer;
    cursor: hand;
}

.cellTableOddRowCell {
    border: selectionBorderWidth solid #f3f7fb;
}

.cellTableHoveredRow {
    background: #eee;
}

.cellTableHoveredRowCell {
    border: selectionBorderWidth solid #eee;
}

.cellTableKeyboardSelectedRow {
    background: #ffc;
}

.cellTableKeyboardSelectedRowCell {
    border: selectionBorderWidth solid #ffc;
}

.cellTableSelectedRow {
    background: #628cd5;
    color: white;
    height: auto;
    overflow: auto;
}

.cellTableSelectedRowCell {
    border: selectionBorderWidth solid #628cd5;
}

/**
 * The keyboard selected cell is visible over selection.
 */
.cellTableKeyboardSelectedCell {
    border: selectionBorderWidth solid #d7dde8;
}

.cellTableLoading {
    margin: 30px;
}

Voila!

Ich hoffe, es wird jemandem da draußen helfen.