Vorlage:Gallery3.css: Unterschied zwischen den Versionen

Version vom 19. Mai 2020, 15:15 Uhr

/*** Beginn allgemeine Formatierungen [[category: bearbeitet]] ***/


.thumb {
  margin-bottom: 0px;
  }

.tright {
  margin: 0px;
  }

.thumbinner {
  max-width:100%;
  border: 0px solid #c8ccd1;
  padding: 0px;
  background-color: #f8f9fa;
  font-size: 94%;
  text-align: left;
  overflow: hidden;
  }


body:not(.collapsed-menu) .thumbinner {
     color: red;
}

@media (max-width: 767px) {

    .thumbinner {
        width: auto !important; /* override style attribute */
    }

    .thumbinner .thumbimage {
        width: auto;
    }
}

.flexbox {
	width: 100%;
	display:flex;
	flex-direction: row;
	flex-wrap: wrap;
	align-items: stretch;
	justify-content: flex-start;
	margin: 0px;
	}

 .flexelement {
	align-items: stretch;
	border: 1px solid #c8ccd1;
	padding: 6px;
	background-color: #f8f9fa;
	font-size: 94%;
	text-align: left;
	/*overflow: hidden;*/
	  margin: 3px 3px 3px 0px;
	/* flex-wrap: wrap; */
	flex: 1 0 250px;
	display: flex;
	flex-wrap: wrap;
	align-content: space-between;
	}

.flexelement img {
	width: 100%;
	height: auto;
}



.flexelement.items_0 {
  max-width: 80%;
  float: right;
  margin-left: 10px;
  margin-bottom:10px;
  margin-top: 0px;
  }

 .flexelement.items_1 {
	flex-basis: 100%;
  }

.flexelement.items_2 {
	flex-basis: 47%;
  }

.flexelement.items_3 {
	/* flex-basis: 31%; */
	max-width: 32%;
	min-width: 270px;
  }

.flexelement.items_4 {
	/* flex-basis: 24%; */
	max-width: 25%;
	min-width: 250px;
  }

.flexelement.items_5 {
	/* flex-basis: 19%; */
	max-width: 20%;
	min-width: 150px;
  }

.flexelement.items_6 {
  width: 16%;
  max-width:16%;
  }

.flexelement.items_7 {
  width: 13%;
  max-width:13%;
  }

.flexelement.items_8 {
  width: 12%;
  max-width:12%;
  }

.flexelement.items_9 {
  width: 11%;
  max-width:11%;
  }

.flexelement.items_10 {
  width: 9%;
  max-width:9%;
  }

/* Ende allgemeine Formatierungen */

/*** Formatierungen für Mobil-Geräte ***/

@media (max-width: 768px) {

.flexelement.items_0 {
  max-width: 100%;
  float: right;
  margin-left: 10px;
  margin-bottom:10px;
  margin-top: 0px;
  }

} /* Ende Formatierung für Mobil-Geräte (max768) */