⌫ Home

Replicating the Medium header

I'm fooling around with CSS for an eventual update of this site, and for features like last week's germs post I'd like to do something more like Medium's post 'cover' images. This is some of the requisite code.

It doesn't replicate the little arrow at the bottom of the header, or the headline styling, or any other fancy stuff like that, yet.

CSS:

html, body {
	height: 100%;
	margin: 0;
	padding: 0;
}
header.feature {
	height: 100%;
	max-height: 900px;
}

HTML:

<body>
	<header class="feature">
		<!-- header content -->
	</header>
	
	<!-- extra stuff as needed -->
</body>
Replicating the Medium header - February 18, 2014 - Ben Keith