Line 5: |
Line 5: |
| /* Box at the top of the main page layout */ | | /* Box at the top of the main page layout */ |
| .icannwiki-top-box { | | .icannwiki-top-box { |
− | background-color: #62a376; | + | display: grid; |
| + | grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); |
| + | gap: 10px; |
| + | background-color: #61a376; |
| border-radius: 5px; | | border-radius: 5px; |
| margin-bottom: 20px; | | margin-bottom: 20px; |
− | padding: 10px; /* Adjust padding as needed */ | + | padding: 10px; |
− | display: flex; /* Use Flexbox */ | + | color: #F2EFEA; |
− | flex-wrap: wrap; /* Allow items to wrap to the next line */
| |
− | align-items: flex-start; /* Align items to the start of the flex container */
| |
| } | | } |
| | | |
− | /* List contained within the top box */
| + | .icannwiki-top-box a { |
− | .icannwiki-invisible-bullet ul { | + | color: #F2EFEA; |
| + | text-decoration: none; |
| + | } |
| + | |
| + | .icannwiki-top-box ul { |
| list-style-type: none; | | list-style-type: none; |
− | list-style: none;
| |
| padding: 0; | | padding: 0; |
| margin: 0; | | margin: 0; |
− | width: 100%; /* Ensure the ul takes full width */
| |
− | display: flex; /* Use Flexbox */
| |
− | flex-wrap: wrap; /* Allow list items to wrap */
| |
− | justify-content: space-between; /* Adjusted for spacing */
| |
| } | | } |
| | | |
− | .icannwiki-invisible-bullet ul li { | + | .icannwiki-top-box li { |
− | list-style-type: none; | + | font-size: 1.2em; |
− | list-style: none;
| + | margin-bottom: 10px; /* Adjust spacing between list items */ |
− | margin-right: 2%; /* Adjust if necessary for fine-tuning */
| |
− | margin-bottom: 10px; /* Vertical space between lines */ | |
− | flex: 1; /* Flex items will grow to fill the space */
| |
− | min-width: 120px; /* Minimum width of each item */
| |
− | font-size: 120%;
| |
− | box-sizing: border-box; /* Include padding and border in the element's total width and height */
| |
− | }
| |
− | | |
− | .icannwiki-invisible-bullet a {
| |
− | color: #dff4e4;
| |
− | text-decoration: none;
| |
| } | | } |
| | | |