|
|
| (One intermediate revision by the same user not shown) |
| Line 6: |
Line 6: |
| float: right !important; | | float: right !important; |
| } | | } |
|
| |
| /* Mobile compatibility for Infoboxes */
| |
| /* Ensure tables are responsive */
| |
| table {
| |
| max-width: 100%;
| |
| width: 100%;
| |
| margin: 0 auto;
| |
| border-collapse: collapse;
| |
| }
| |
|
| |
| table img {
| |
| max-width: 100%; /* Ensure images within tables scale */
| |
| height: auto;
| |
| }
| |
|
| |
| /* Style the outer table for better appearance on mobile */
| |
| .mobile-friendly-table {
| |
| border: 1px solid silver;
| |
| background-color: white;
| |
| font-size: 90%;
| |
| margin: 10px auto;
| |
| width: 100%;
| |
| max-width: 100%;
| |
| padding: 5px;
| |
| }
| |
|
| |
| /* Header styling for better visibility on mobile */
| |
| .mobile-friendly-header {
| |
| font-size: 110%;
| |
| text-align: center;
| |
| background-color: #d4e3e5;
| |
| padding: 10px;
| |
| }
| |
|
| |
| /* Make images responsive and centered */
| |
| .mobile-friendly-image {
| |
| background-color: #BCE2E7;
| |
| background-image: linear-gradient(to bottom, #aed6e3, #caefec);
| |
| max-width: 160px; /* Use max-width instead of fixed width */
| |
| height: auto;
| |
| margin: auto;
| |
| display: block;
| |
| text-align: center;
| |
| }
| |
|
| |
| .mobile-friendly-image img {
| |
| max-width: 100%; /* Responsive image scaling */
| |
| height: auto;
| |
| }
| |
|
| |
| /* Style the icon container */
| |
| .mobile-friendly-icons {
| |
| text-align: center;
| |
| margin-top: 10px;
| |
| }
| |
|
| |
| /* Style icons with proper spacing */
| |
| .mobile-friendly-icons img {
| |
| max-width: 40px;
| |
| height: auto;
| |
| margin: 0 5px;
| |
| }
| |
|
| |
| /* Make tables more readable on mobile */
| |
| table th,
| |
| table td {
| |
| padding: 8px;
| |
| text-align: left;
| |
| background-color: #d4e3e5;
| |
| }
| |
|
| |
| @media (max-width: 600px) {
| |
| /* Scale down font size and padding for mobile devices */
| |
| .mobile-friendly-header {
| |
| font-size: 100%;
| |
| padding: 5px;
| |
| }
| |
| .mobile-friendly-table {
| |
| font-size: 85%;
| |
| }
| |
| }
| |
|
| |
|
| |
|
| .ns-6 .editsection, | | .ns-6 .editsection, |