diff --git a/packages/web/src/components/result/ResultCard.d.ts b/packages/web/src/components/result/ResultCard.d.ts
index 59d8688d80..547d1a8ed5 100644
--- a/packages/web/src/components/result/ResultCard.d.ts
+++ b/packages/web/src/components/result/ResultCard.d.ts
@@ -7,6 +7,7 @@ declare namespace ResultCardTree {
 		children: React.ReactNode;
 		href?: string;
 		id?: string|number;
+		autoHeight?: boolean;
 	}
 
 	interface ImageProps extends React.HTMLAttributes<HTMLDivElement> {
diff --git a/packages/web/src/components/result/ResultCard.js b/packages/web/src/components/result/ResultCard.js
index 34922d51be..79cec9f084 100644
--- a/packages/web/src/components/result/ResultCard.js
+++ b/packages/web/src/components/result/ResultCard.js
@@ -39,10 +39,12 @@ ResultCard.propTypes = {
 	target: types.stringRequired,
 	id: oneOfType([types.string, types.number]),
 	href: types.string,
+	autoHeight: types.bool,
 };
 
 ResultCard.defaultProps = {
 	target: '_blank',
+	autoHeight: false,
 };
 
 export default ResultCard;
diff --git a/packages/web/src/styles/Card.js b/packages/web/src/styles/Card.js
index 89690a2dc8..2b4aea3b9b 100644
--- a/packages/web/src/styles/Card.js
+++ b/packages/web/src/styles/Card.js
@@ -39,7 +39,8 @@ const Card = styled('a')`
 		(theme.colors.backgroundColor
 			? lighten(0.1, theme.colors.backgroundColor)
 			: '#fff')};
-	height: 300px;
+	height: ${props => (props.autoHeight ? 'auto' : '300px')};
+	min-height: 300px;
 	display: flex;
 	flex-direction: column;
 	justify-content: space-between;
@@ -55,9 +56,9 @@ const Card = styled('a')`
 		width: 100%;
 		font-size: 0.9rem;
 		line-height: 1.2rem;
-		white-space: nowrap;
-		overflow: hidden;
-		text-overflow: ellipsis;
+		white-space: ${props => (props.autoHeight ? 'normal' : 'nowrap')};
+		overflow: ${props => (props.autoHeight ? 'visible' : 'hidden')};
+		text-overflow: ${props => (props.autoHeight ? 'unset' : 'ellipsis')};
 		margin: 0;
 		padding: 10px 0 8px;
 	}