Хак для опускания вниз рейтинга в посту:
Код:
<!-- Хак для опускания вниз рейтинга в посту --> <style> .post>.container { display: grid; grid-template-areas: "author body" "links links"; grid-template-rows: auto auto; grid-template-columns: auto 1fr; } .post-author { grid-area: author; float: none !important; } .post-body { grid-area: body; margin-left: 0 !important; padding: 1em !important; } .post-links { grid-area: links; } .post-author, .post-body {word-wrap: break-word;} .post-box { display: grid; grid-template-areas: "content content" "vote rating"; grid-template-rows: 1fr auto 0; grid-template-columns: 1fr auto; height: 100%; padding: 0 !important; } .post-content {grid-area: content;} .post-rating {grid-area: rating;} .post-vote {grid-area: vote;float: right;} </style>
Добавка/Правка для мобильного стиля:
Код:
<style> @media screen and (max-width: 540px) { .post>.container { grid-template-areas: "author" "body" "links"; grid-template-rows: auto auto auto; grid-template-columns: auto; } } </style>
Возможно придется перекрашивать фон в некоторых стандартных дизайнах, потому что я поменял паддинг местами из внутреннего контейнера в контейнер родителя, то есть из post-box в post-body - в нем сидел баг, который ломал хак..
P.S. По поводу grid - у него есть особенность сочетания ширины и высоты в процентах и padding.. grid считает 100% + padding, а не 100% включая padding, поэтому может выходить за рамки контейнера родителя..