Table CSS

Vaadin 6 / 7 / 8 Framework UI
1

Hi,

I have two questions:

  1. By default vaadin table header is UPPERCASE. How can i change it such that first letter of the table column header is uppercase and rest lowercase. Eg : Name

  2. . I am not using alternate colouring of the rows in vaadin table.I would need a border after each row.
    How to set row border in table??

Looking forward for help.

Thanks

2

Can anyone help me???

3

See
http://vaadin.com/forum/-/message_boards/message/197903

With a little CSS this can be done:


.v-table-header table, .v-table-table{
      border-collapse: collapse;
}
.v-table-row{
     border-bottom: 1px solid red;
}
4

A quick Google search turns up several forum threads covering this as well as
enhancement request 6293
 that has an example of CSS for changing this. Note that this is specific to the Reindeer theme.

As for your other question, maybe some CSS person could answer it.

5

Thanks alot… :slight_smile:

Lemme try tis out !!!

6
  1. . I am not using alternate colouring of the rows in vaadin table.I would need a border after each row.
    How to set row border in table??

I need this too. Did anyone get this to work?

7

This should work Vipul.

  .v-table-cell-content {
    border-bottom: 1px solid black;
  }
8

It did … Thank You Joaci!!

9

Hi John,
Thanks for your css. It seems to be working pretty well.
However, in Chrome, and sometimes in IE11 if I refresh the page (F5) or the table is repainted. I am getting horizontal scroll bars for the table, but it looks like the scroll bar is only there because there was a vertical scroll bar added. It looks like the table is not rendering properly. Any ideas? I have attached a picture. Thanks.

18402.png