Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Need to set 'min-height: 0' for blank columns. #26975

Closed
adsingh14 opened this issue Jul 26, 2018 · 2 comments
Closed

Need to set 'min-height: 0' for blank columns. #26975

adsingh14 opened this issue Jul 26, 2018 · 2 comments
Labels

Comments

@adsingh14
Copy link

Before opening:

Bug reports must include:

  • Operating system and version (Windows, macOS, Android, iOS, Win10 Mobile): Windows
  • Browser and version (Chrome, Firefox, Safari, IE, MS Edge, Opera 15+, Android Browser): Chrome 67+
  • Reduced test case
@royklutman
Copy link
Contributor

Just to elaborate on this, it's currently set to 1px to prevent collapsing:

%grid-column {
position: relative;
width: 100%;
min-height: 1px; // Prevent columns from collapsing when empty
padding-right: ($gutter / 2);
padding-left: ($gutter / 2);
}

Maybe someone can explain why this is done exactly and why columns may not collapse when empty?

@MartijnCuppens
Copy link
Member

MartijnCuppens commented Jul 30, 2018

The grid used to be float based. If a column was empty, the height would be 0 and the column to the right would move over this column because it wouldn't take any space. The min-height: 1px; was than added to fix this behaviour.

We can now safely remove this, because the new flexbox based grid doesn't have this issue.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

No branches or pull requests

4 participants