Document mobile responsiveness (#45)

pull/47/head
Jeff Puckett 2017-06-15 10:43:33 +00:00 committed by Sindre Sorhus
parent 576e8f6479
commit c59b17b20d
1 changed files with 8 additions and 1 deletions

View File

@ -18,9 +18,10 @@ $ npm install --save github-markdown-css
## Usage
Import the `github-markdown.css` file and add a `markdown-body` class to the container of your rendered Markdown and set a width for it. GitHub uses `980px` width and `45px` padding.
Import the `github-markdown.css` file and add a `markdown-body` class to the container of your rendered Markdown and set a width for it. GitHub uses `980px` width and `45px` padding, and `15px` padding for mobile.
```html
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="github-markdown.css">
<style>
.markdown-body {
@ -30,6 +31,12 @@ Import the `github-markdown.css` file and add a `markdown-body` class to the con
margin: 0 auto;
padding: 45px;
}
@media (max-width: 767px) {
.markdown-body {
padding: 15px;
}
}
</style>
<article class="markdown-body">
<h1>Unicorns</h1>