Template:Mbox/styles.css: Difference between revisions
Page last edited 2 weeks ago by Xeverything11
Created page with ".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-body { flex: 1; } @media screen and (max-width: 750px) { }" |
mobile |
||
Line 25: | Line 25: | ||
@media screen and (max-width: 750px) { | @media screen and (max-width: 750px) { | ||
.mbox { | |||
flex-direction: column; | |||
} | |||
.mbox-image-left { | |||
flex-direction: row; | |||
margin: 0 1rem 1rem; | |||
} | |||
.mbox-image-right { | |||
flex-direction: row; | |||
margin: 1rem 1rem 0; | |||
} | |||
} | } |
Revision as of 13:35, 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-body {
flex: 1;
}
@media screen and (max-width: 750px) {
.mbox {
flex-direction: column;
}
.mbox-image-left {
flex-direction: row;
margin: 0 1rem 1rem;
}
.mbox-image-right {
flex-direction: row;
margin: 1rem 1rem 0;
}
}