Research Realm:Main Page/Sandbox/styles.css: Difference between revisions
From Research Realm
Created page with "→styles.css: body { margin: 0; font-family: Arial, sans-serif; background-color: #f4f4f4; } .flex-container { display: flex; flex-wrap: wrap; gap: 20px; padding: 20px; max-width: 1200px; margin: 0 auto; } .flex-item { flex: 1 1 calc(33.333% - 20px); box-sizing: border-box; padding: 20px; background-color: #ffffff; border: 1px solid #ddd; border-radius: 8px; text-align: center; box-shadow: 0 4px 8px..." |
No edit summary |
||
Line 31: | Line 31: | ||
color: #333; | color: #333; | ||
margin-bottom: 20px; | margin-bottom: 20px; | ||
} | |||
@media (min-width: 875px) { | |||
#mp-upper { | |||
display: flex; | |||
} | |||
#mp-left { | |||
flex: 1 1 20%; | |||
margin: 2px; | |||
} | |||
} | } |
Revision as of 08:55, 16 October 2025
/* styles.css */
body {
margin: 0;
font-family: Arial, sans-serif;
background-color: #f4f4f4;
}
.flex-container {
display: flex;
flex-wrap: wrap;
gap: 20px;
padding: 20px;
max-width: 1200px;
margin: 0 auto;
}
.flex-item {
flex: 1 1 calc(33.333% - 20px);
box-sizing: border-box;
padding: 20px;
background-color: #ffffff;
border: 1px solid #ddd;
border-radius: 8px;
text-align: center;
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
transition: transform 0.3s ease, box-shadow 0.3s ease;
}
h1 {
text-align: center;
color: #333;
margin-bottom: 20px;
}
@media (min-width: 875px) {
#mp-upper {
display: flex;
}
#mp-left {
flex: 1 1 20%;
margin: 2px;
}
}