Components’ height cannot be manipulated (Materialize CSS)

[mrchow19910319]

I am using Materialize CSS to create a front end mockup where I found that the height of the coponent tabs, cannot be altered.

Inside the codepen is an simple example where I try to make the tab components inside tabs any size I want. The idea is to control those elements’ sizes so that I can style it better. Make the fonts bigger and such. Or I can straight up put other content into those tabcomponent.

 

codepen link

 

Inside the codepen you can see the 1st issue I am facing is : I cannot get the tab component to fill up its parent tabs.

 

Is anyone familiar with Materialize CSS? 

[infamoustrey]

.tabs { height: 100px; } 
.tab { height: 100% !important; }

Seems to work for me.

[mrchow19910319]

23 hours ago, infamoustrey said:

.tabs { height: 100px; } 
.tab { height: 100% !important; }

Seems to work for me.

Ah.. thanks