{"action":"created","issue":{"url":"https://api.github.com/repos/facebook/react-native/issues/2724","labels_url":"https://api.github.com/repos/facebook/react-native/issues/2724/labels{/name}","comments_url":"https://api.github.com/repos/facebook/react-native/issues/2724/comments","events_url":"https://api.github.com/repos/facebook/react-native/issues/2724/events","html_url":"https://github.com/facebook/react-native/issues/2724","id":106600844,"number":2724,"title":"[Android][css-layout] Equal-height columns ","user":{"login":"corbt","id":176426,"avatar_url":"https://avatars.githubusercontent.com/u/176426?v=3","gravatar_id":"","url":"https://api.github.com/users/corbt","html_url":"https://github.com/corbt","followers_url":"https://api.github.com/users/corbt/followers","following_url":"https://api.github.com/users/corbt/following{/other_user}","gists_url":"https://api.github.com/users/corbt/gists{/gist_id}","starred_url":"https://api.github.com/users/corbt/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/corbt/subscriptions","organizations_url":"https://api.github.com/users/corbt/orgs","repos_url":"https://api.github.com/users/corbt/repos","events_url":"https://api.github.com/users/corbt/events{/privacy}","received_events_url":"https://api.github.com/users/corbt/received_events","type":"User","site_admin":false},"labels":[{"url":"https://api.github.com/repos/facebook/react-native/labels/Android","name":"Android","color":"bfe5bf"}],"state":"open","locked":false,"assignee":null,"milestone":null,"comments":15,"created_at":"2015-09-15T17:02:37Z","updated_at":"2015-09-16T21:44:45Z","closed_at":null,"body":"**UPDATE**: For those just arriving, see my [next comment](#issuecomment-140491988) on this issue for a simplified and reproducible test case.\r\n\r\n--------------------------------------\r\nI've been playing around with React Native on Android. I'm implementing a toy Hacker News reader to learn about the API.\r\n\r\nI'm running into an issue that appears to be related to either the flexbox model or React Native's implementation of it. I'm the first to admit that I'm not a flexbox expert so there may be an obvious solution to my problem that I'm not aware of.\r\n\r\nEssentially, I have two columns, each wrapped inside a `TouchableHighlight`. I want the heights to be equal (and I don't know ahead of time which will be taller). I've found that if I manually set the height of the parent view, as seen below, everything is calculated correctly. However, if I allow the parent View to be calculated based on the heights of its two children, the `alignItems: 'stretch'` stops working and I'm not able to center the views vertically and make them the same height.\r\n\r\nI wasn't totally sure whether to open this as an issue here or post it on Stack Overflow, but since I'm not sure whether it would be seen there (and because it's possibly related to a bug in the Flexbox implementation) I thought I'd ask here.\r\n\r\n```jsx\r\n<View style={{borderBottomWidth: 1, borderBottomColor: '#FFB65D', flexDirection: 'row', alignItems: 'stretch', height: 100}}>\r\n  <TouchableHighlight style={{flex: 1}}>\r\n    <View style={{flex: 1, padding: 10, backgroundColor: 'white', justifyContent: 'center'}}>\r\n      <Text style={{fontSize: 15, color: 'black'}}>{this.props.story.title}</Text>\r\n      <View style={{flexDirection: 'row', color: 'gray'}}>\r\n        <Text>{this.props.story.points} points</Text>\r\n        {separator}\r\n        <Text>{this.props.story.user}</Text>\r\n        {separator}\r\n        <Text>{this.props.story.time_ago}</Text>\r\n      </View>\r\n    </View>\r\n  </TouchableHighlight>\r\n  <TouchableHighlight>\r\n    <View style={{flex: 1, backgroundColor: '#FFCC8D', alignItems: 'center', justifyContent: 'center', flexDirection: 'column', padding: 5}}>\r\n      <Text style={{fontSize: 30}}>{this.props.story.comments_count}</Text>\r\n      <Text style={{fontSize: 10}}>COMMENTS</Text>\r\n    </View>\r\n  </TouchableHighlight>\r\n</View>\r\n```"},"comment":{"url":"https://api.github.com/repos/facebook/react-native/issues/comments/140903014","html_url":"https://github.com/facebook/react-native/issues/2724#issuecomment-140903014","issue_url":"https://api.github.com/repos/facebook/react-native/issues/2724","id":140903014,"user":{"login":"brentvatne","id":90494,"avatar_url":"https://avatars.githubusercontent.com/u/90494?v=3","gravatar_id":"","url":"https://api.github.com/users/brentvatne","html_url":"https://github.com/brentvatne","followers_url":"https://api.github.com/users/brentvatne/followers","following_url":"https://api.github.com/users/brentvatne/following{/other_user}","gists_url":"https://api.github.com/users/brentvatne/gists{/gist_id}","starred_url":"https://api.github.com/users/brentvatne/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/brentvatne/subscriptions","organizations_url":"https://api.github.com/users/brentvatne/orgs","repos_url":"https://api.github.com/users/brentvatne/repos","events_url":"https://api.github.com/users/brentvatne/events{/privacy}","received_events_url":"https://api.github.com/users/brentvatne/received_events","type":"User","site_admin":false},"created_at":"2015-09-16T21:44:45Z","updated_at":"2015-09-16T21:44:45Z","body":"@mkonicek - we should link to that in the Flexbox docs"}}