- 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 layout losing proportions when reduced in size
To avoid the Flexbox layout issue, you need to add the following:
* {
flex-shrink: 0;
min-width: 0;
min-height: 0;
}Here,
flex-shrink: 1 - Flex items are allows to shrink
min-width: 0 - flex items to shrink past their content
Updated on 28-Jan-2020 09:19:54
- Related Questions & Answers
- CSS Flexbox Layout Module
- Advance CSS layout with flexbox
- How to create a flexbox Layout in HTML?
- C++ program to find reduced size of the array after removal operations
- Create an inline flexbox container on a specific screen size in Bootstrap 4
- Create a flexbox container on a specific screen size with Bootstrap 4
- Specify the size of the rows in a CSS grid layout
- Flexbox and vertical scroll in a full-height app using newer Flexbox API with HTML
- How to work with Flexbox elements in CSS?
- Create an inline flexbox container in Bootstrap 4
- CSS Grid Layout
- Create a Flexbox container with Bootstrap 4
- How to rethrow InnerException without losing stack trace in C#?
- Is engineering really losing its worth by the time?
- Convert an array to reduced form (Hashing) in C++
Advertisements