- Trending Categories
Data Structure
Networking
RDBMS
Operating System
Java
iOS
HTML
CSS
Android
Python
C Programming
C++
C#
MongoDB
MySQL
Javascript
PHP
- Selected Reading
- UPSC IAS Exams Notes
- Developer's Best Practices
- Questions and Answers
- Effective Resume Writing
- HR Interview Questions
- Computer Glossary
- Who is Who
Flexbox and vertical scroll in a full-height app using newer Flexbox API with HTML
The flex property is a shorthand for the flex-grow, flex-shrink, and flex-basis properties. The flex property sets the flexible length on flexible items.
For example −
#container article {
-webkit-flex: 1 1 auto;
overflow-y: auto;
height: 0px; /*here the height is set to 0px*/
}If you want a min-height, the use height: 100px; that it is exactly the same as − min-height: 100px;
#container article {
-webkit-flex: 1 1 auto;
overflow-y: auto;
height: 100px; /*here the height is set to 100px*/
}
Updated on 24-Jun-2020 14:16:04
- Related Questions & Answers
- Horizontal and Vertical Center Alignment with Flexbox in CSS3
- How to create a flexbox Layout in HTML?
- Advance CSS layout with flexbox
- Create a Flexbox container with Bootstrap 4
- CSS Flexbox Layout Module
- How to work with Flexbox elements in CSS?
- Does 'position: absolute' conflict with flexbox?
- Solve unknown gap between elements in Flexbox with HTML5.
- Setting a Fixed Width for Items in CSS Flexbox
- Creating a Slider / Carousel with CSS Flexbox (with infinite repeating items in loop)
- Create a flexbox container on a specific screen size with Bootstrap 4
- Flexbox layout losing proportions when reduced in size
- Create an inline flexbox container in Bootstrap 4
- Create an inline flexbox container on a specific screen size in Bootstrap 4
- Creating a Full Height Page with Fixed Sidebar and Scrollable Content Area in CSS
Advertisements