TabSheet and Grid

Hi everyone! I’m just today start using Vaadin for a University exam project. I found a problem using the component Grid inside the tabs of the component TabSheet.
This is part of code:

TabSheet tabs = new TabSheet();
Grid<Prenotazione> grid = new Grid<>(Prenotazione.class);

grid.addColumn(prenotazione -> prenotazione.getCittadino().getAnagrafica().getCognome()).setHeader("Cognome");
grid.addColumn(prenotazione -> prenotazione.getCittadino().getEmail()).setHeader("Email");
grid.addColumn(prenotazione -> prenotazione.getData().toString()).setHeader("Data");
grid.addColumn(prenotazione -> prenotazione.getOrario().toString()).setHeader("Orario");
grid.addColumn(prenotazione -> prenotazione.getMotivazione().getFormattedName()).setHeader("Motivazione");
grid.addColumn(prenotazione -> prenotazione.getStato().getFormattedName()).setHeader("Stato");
grid.getColumns().forEach(col -> col.setAutoWidth(true));

grid.setItems(db_service.findAllPrenotazione());
grid.setSizeFull();

tabs.add("Rilascio passaporto", grid);ù
HorizontalLayout header = PageElements.getHeader(false);
HorizontalLayout footer = PageElements.getFooter();
add(header,tabs,footer);

If i add the component grid inside the tabs tha page show only a grey line that should saparate headers and rows (I try insert grind in a Div or HorizontalLayout and put this in tab but same result).

If i add the component grid outside the tabs (like the next code) the Grind will see normaly (See images).

add(header,grid,tabs,footer);

Im pretty new using Vaadin and don’t know too much about frontend so i image i miss some detail/attribute configuration of TabSheet.

Ty for time!
inside_tab.png
outside_tab.png

Tabsheet has no height, therefore the grid isn’t displayed. If you define a height for the tabsheet it’s visible

I use tabs.setHeightFull(); but nothing change, i will check if i put it in some Layout witout use .setSizeFull or .setHeightFull() but i don’t think is this the case.

If you use F12 / Developer Tools of the Browser you can inspect what element is missing the height.

I don’t see div between vaadin-grid and the HorizontallLayout conteined in the tab :person_shrugging:
image.png

Okay i foud it! Thank u for the tips! I have to reduce the Layouts

That’s always helpful :sweat_smile:

Here is like Git forum that there is to close the discussion?

No all good, nothing to close here