Tips
- A css question. If I have a div container whose height is unknown.
Inside it we have a nav section whose height we don't know too.
How to make sure that next block inside container takes rest of the height.
Normally if there is no other block above it then we can simply use height:100% but here it will overflow.
```css
#parent {
display:flex;
flex-direction: column;
}
#secondBlock {
flex: 1;
}
```
To get more info about how flex-1 behaves check the following
```html
Document
Users
Reviews
Notifications
```
```css
.w-500{
width: 500px;
}
.flex{
display: flex;
}
.col{
flex-direction: column
}
.flex-1{
flex: 1;
}
```
- there is sidepanel at right side which expand. it have invisible extra width so each item can expand to that when hovered but that invisible portion i dont want it to effect rest of page. and able to interact with. how do i fix it
```css
.parent{
pointer-events : none;
}
.child{
pointer-events : auto;
}
.child:hover{
...
}
```