Template:Mbox/styles.css: Difference between revisions
Page last edited 5 months ago by Xeverything11
mobile |
tweaks |
||
Line 18: | Line 18: | ||
display: flex; | display: flex; | ||
flex-direction: column; | flex-direction: column; | ||
} | |||
.mbox-image-left img, .mbox-image-right img { | |||
margin: 0.25rem 0; | |||
} | } | ||
Line 31: | Line 35: | ||
.mbox-image-left { | .mbox-image-left { | ||
flex-direction: row; | flex-direction: row; | ||
margin: | margin: 1rem 1rem 0; | ||
} | } | ||
.mbox-image-right { | .mbox-image-right { | ||
flex-direction: row; | flex-direction: row; | ||
margin: 1rem 1rem 0; | margin: 0 1rem 1rem; | ||
} | |||
.mbox-image-left img, .mbox-image-right img { | |||
margin: 0 0.25rem; | |||
} | } | ||
} | } |
Revision as of 13:38, 13 April 2025
.mbox { margin: 0.5rem 0; padding: 0 1rem; border: 1px solid var(--color-primary1); border-radius: 4px; display: flex; align-items: center; } .mbox-image-left { margin: 1rem 1rem 1rem 0; display: flex; flex-direction: column; } .mbox-image-right { margin: 1rem 0 1rem 1rem; display: flex; flex-direction: column; } .mbox-image-left img, .mbox-image-right img { margin: 0.25rem 0; } .mbox-body { flex: 1; } @media screen and (max-width: 750px) { .mbox { flex-direction: column; } .mbox-image-left { flex-direction: row; margin: 1rem 1rem 0; } .mbox-image-right { flex-direction: row; margin: 0 1rem 1rem; } .mbox-image-left img, .mbox-image-right img { margin: 0 0.25rem; } }