MediaWiki:Common.css: Unterschied zwischen den Versionen

Version vom 11. September 2026, 09:47 Uhr

/* Das folgende CSS wird für alle Benutzeroberflächen geladen. */

/* Zwei Boxen für Hauptseite Aktuelles, Hinweise */

div.sc_box_left {
    float:left;
    width: 45%;
    min-width:200px;
    height:200px;
    border: 2px groove lightgreen;
    background-color: cornsilk;
    margin-right:20px;
    margin-bottom:10px;
 }

div.sc_box_right {
    float:left;
    width: 45%;
    min-width:200px;
    height:200px;
    border: 2px groove lightgreen;
    background-color: whitesmoke;
}

div.sc_box_heading{
    width: 90%
    height:38px;
    padding-left:10px;
}

div.sc_boxl_content{
    width: 90%;
    height: 150px;
    padding-left:10px;
    overflow-y: auto;
    overflow-x: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    font-size:12pt;
    line-height:140%;
}
div.sc_boxr_content{
    width: 90%;
    height: 150px;
    padding-left:10px;
    overflow-y: auto;
    overflow-x: hidden;
    /* white-space: nowrap;
    text-overflow: ellipsis; */
}

div.sc_box_black{
    width: 98%;
    border: 2px solid black;
    padding:5px;
}

/*--Varianten für Handy-Display--*/

@media screen and (max-width: 640px) {
    div.sc_box_left {
       width: 98%;
       min-width:150px;
       height:200px;
       border: 2px groove lightgreen;
       background-color: cornsilk;
       margin-bottom:10px;
    }

    div.sc_box_right {
       width:98%;
       min-width:150px;
       height:200px;
       border: 2px groove lightgreen;
       background-color:whitesmoke;
    }
}

/* Flex-Anordnung für Tabellen auf Mannschaftsseiten */
.sc_flexed {
   display: flex;
   flex-wrap: wrap;
   gap:20px;
   justify-content: center;
   align-items: start;
}

/* Anordnung Bilder neben Tabelle bzw. übereinander auf kleinem Bildschirm */
.responsive-columns {
    display: flex;
    gap: 2em;
    align-items: flex-start;
}

.column-table,
.column-gallery {
    flex: 1 1 0;
    min-width: 0;
}

@media (max-width: 700px) {
    .responsive-columns {
        flex-direction: column;
    }

    .column-table,
    .column-gallery {
        width: 100%;
    }
}