Automattic / Automattic/jetpack
Related Posts: Layout breaks when there are more than 3 results
- Dominant language
- PHP
- Stars
- 1.8k
- Forks
- 898
- Avg merge
- 1d 18h
- Merged PRs (30d)
- 774
Description
When you have more than 3 results in your RPs, the layout is a bit wonky on displays under 640px.
Example:
I have been suggesting the following as a solution for people who have this issue.
```css
@media only screen and (max-width: 640px) {
div#jp-relatedposts div.jp-relatedposts-items .jp-relatedposts-post:nth-child(3n+4),
div#jp-relatedposts div.jp-relatedposts-items-visual .jp-relatedposts-post:nth-child(3n+4) {
clear: right;
}
div#jp-relatedposts div.jp-relatedposts-items .jp-relatedposts-post:nth-child(3n+6) {
clear: right;
}
div#jp-relatedposts div.jp-relatedposts-items .jp-relatedposts-post:nth-child(3) {
clear: left;
}
}
```
Result:
Contributor guide
Assessment
This issue has not been assessed yet.