This repository was archived by the owner on Sep 5, 2024. It is now read-only.
-
Notifications
You must be signed in to change notification settings - Fork 3.4k
This repository was archived by the owner on Sep 5, 2024. It is now read-only.
layout: flex-basis bug #5345
Copy link
Copy link
Closed
Description
flex-offset
and flex
have width calculation issue in 1.0.0-rc1
Take a look at this code:
<!DOCTYPE html>
<html lang="en" >
<head>
<title>Simple Layout</title>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="description" content="">
<meta name="viewport"
content="initial-scale=1, maximum-scale=1, user-scalable=no" />
<link rel="stylesheet"
href="./lib/angular-material/angular-material.css"/>
<link rel="stylesheet"
href="http://fonts.googleapis.com/css?family=Roboto:400,500,700,400italic">
<style>
div.flex, div.flex-25, div.flex-50 {
border: 1px dotted gray;
padding: 8px;
background-color: #90CAF9; /* Blue 200 */
}
div.md-layout-column {
background-color: #FFE0B2; /* Orange 100 */
text-align: center;
}
</style>
</head>
<body ng-app="myApp">
<div layout="row">
<div flex flex-offset="20">#1 -->20%</div>
</div>
<div layout="row" style="margin-top: 24px;">
<div flex flex-offset="50">#2 -->50% (25%)</div>
<div flex>#3 (25%)</div>
</div>
<div layout="row" style="margin-top: 24px;">
<div flex="25" flex-offset="25">#4 -->25% (25%)</div>
<div flex="50" flex-offset="20">#5 -->20% (50%)</div>
</div>
<!-- Angular/Material scripts -->
<script src="./lib/angular/angular.js"></script>
<script src="./lib/angular-animate/angular-animate.js"></script>
<script src="./lib/angular-aria/angular-aria.js"></script>
<script src="./lib/angular-material/angular-material.js"></script>
<!-- App-specific scripts -->
<script type="text/javascript">
angular
.module('myApp', ['ngMaterial'])
</script>
</body>
</html>
The first two grid is rendered as expected. The third grid worked OK in previous versions (it overflew the right edge of the window and thus displayed a horizontal scrollbar), but it does not work this way with rc1.
When examining in Chrome, offset spacing is calculated properly, but cell widths are not.
0.11.2: Correct
1.0.0-rc1: Strange