Wechseln zu:Navigation, Suche
Wiki

Vorlage:Portfilter.css

Aus Securepoint Wiki
/** sptable2 spezial **/


/*** Formatierungen für max 768 ***/

@media (max-width: 768px) {

.sptable2.spezial tbody > tr {
	display:		grid; 
	grid-template-columns:	1fr 1fr repeat(3, 2fr);
	width:			100%;
}

.sptable2.spezial tr > td.bild {
	grid-column:		1/3;
	grid-row:		1;
	background:		white;
	border-width:		0;
	padding-top:		10px;
	padding-bottom:		0px;
	width:			100%;
}

.sptable2.spezial tr > th.bild {
	grid-column:		1/3;
	grid-row:		4;
	background:		white;
	border-width:		0;
	padding-top:		10px;
	padding-bottom:		0px;
	width:			100%;
}

.sptable2.spezial tr > td {
	border-color:		#a2a9b1;
	border-style:		solid;
	margin-top:		unset;
}

.sptable2.spezial td:nth-child(1) {
	grid-column:		1/6;
	background-color:	#b6b6b6;
	border-top-width:	2px;
	border-right-width:	2px;
	border-bottom-width:	0;
	border-left-width:	2px;
	text-align:		left;
}

.sptable2.spezial tr > td:nth-child(2),
.sptable2.spezial tr.no1cell > td:nth-child(1) {
	grid-column:		1;
	grid-row:		3;
	background-color:	#fff;
	border-top-width:	1px;
	border-right-width:	1px;
	border-bottom-width:	0;
	border-left-width:	2px;
	vertical-align:		middle;
}

.sptable2.spezial tr > td:nth-child(3),
.sptable2.spezial tr.no1cell > td:nth-child(2) {
	grid-column:		2;
	background-color:	#fff;
	border-top-width:	1px;
	border-right-width:	1px;
	border-bottom-width:	0;
	border-left-width:	0px;
}

.sptable2.spezial tr > td:nth-child(4),
.sptable2.spezial tr.no1cell > td:nth-child(3) {
	grid-column: 3;
	background-color:	#fff;
	border-top-width:	1px;
	border-right-width:	1px;
	border-bottom-width:	0;
	border-left-width:	0px;
}

.sptable2.spezial tr > td:nth-child(5),
.sptable2.spezial tr.no1cell > td:nth-child(4) {
	grid-column:		4;
	background-color:	#fff;
	border-top-width:	1px;
	border-right-width:	1px;
	border-bottom-width:	0;
	border-left-width:	0px;
}

.sptable2.spezial tr > td:nth-child(6),
.sptable2.spezial tr.no1cell > td:nth-child(5) {
	grid-column:		5;
	background-color:	#fff;
	border-top-width:	1px;
	border-right-width:	2px;
	border-bottom-width:	0;
	border-left-width:	0px;
}

.sptable2.spezial tr > td:nth-child(7),
.sptable2.spezial tr.no1cell > td:nth-child(6) {
	grid-column:		1 / span 2;
	background-color:	#fff;
	border-top-width:	1px;
	border-right-width:	1px;
	border-bottom-width:	2px;
	border-left-width:	2px;
}

.sptable2.spezial tr > td:nth-child(8),
.sptable2.spezial tr.no1cell > td:nth-child(7) {
	grid-column:		3;
	background-color:	#fff;
	border-top-width:	1px;
	border-right-width:	1px;
	border-bottom-width:	2px;
	border-left-width:	0px;
}

.sptable2.spezial tr > td:nth-child(9),
.sptable2.spezial tr.no1cell > td:nth-child(8) {
	grid-column:		4;
	background-color:	#fff;
	border-top-width:	1px;
	border-right-width:	1px;
	border-bottom-width:	2px;
	border-left-width:	0px;
}

.sptable2.spezial tr > td:nth-child(10),
.sptable2.spezial tr.no1cell > td:nth-child(9) {
	grid-column:		5;
	background-color:	#fff;
	border-top-width:	1px;
	border-right-width:	2px;
	border-bottom-width:	2px;
	border-left-width:	0px;
}

.sptable2.spezial tr > td:last-child {
	border-bottom-width:	2px;
}

.sptable2.spezial tr:first-child > td:nth-child(1) {
	display:		none;
}

.sptable2.spezial tr:first-child > td:nth-child(2),
.sptable2.spezial tr:first-child > td:nth-child(3),
.sptable2.spezial tr:first-child > td:nth-child(4),
.sptable2.spezial tr:first-child > td:nth-child(5),
.sptable2.spezial tr:first-child > td:nth-child(6) {
	border-top-width:	2px !important;
}

.sptable2.spezial tr:first-child > th {
	background-color:	#ccc;
}


} /*** Ende Formatierungen für max 768 ***/





/*** Formatierungen für max 576 ***/

@media (max-width: 576px) {

.sptable2.spezial tbody > tr {
	display:		grid; 
	grid-template-columns:	repeat(3, 1.5em) repeat(3, 2fr);
	width:			100%;
}

.sptable2.spezial tr > td.bild {
	grid-column:		1/3;
	grid-row:		1;
	background:		white;
	border-width:		0;
	padding-top:		10px;
	padding-bottom:		0px;
	width:			100%;
}

.sptable2.spezial tr > th.bild {
	grid-column:		1/3;
	grid-row:		4;
	background:		white;
	border-width:		0;
	padding-top:		10px;
	padding-bottom:	0px;
	width:			100%;
}

.sptable2.spezial tr > td {
	border-color:		#a2a9b1;
	border-style:		solid;
	margin-top:		unset;
	padding-left:		2px;
}

.sptable2.spezial td:nth-child(1) {
	grid-column:		1/7;
	background-color:	#b6b6b6;
	border-top-width:	2px;
	border-right-width:	2px;
	border-bottom-width:	0;
	border-left-width:	2px;
	text-align:		left;
}

.sptable2.spezial tr > td:nth-child(2) {
	grid-column:		1;
	grid-row:		span 3;
	background-color:	#fff;
	border-top-width:	1px;
	border-right-width:	1px;
	border-bottom-width:	0;
	border-left-width:	2px;
	vertical-align:	middle;
}

.sptable2.spezial tr.no1cell > td:nth-child(1) {
	grid-column:		1;
	grid-row:		span 3;
	background-color:	#fff;
	border-top-width:	1px;
	border-right-width:	1px;
	border-bottom-width:	0;
	border-left-width:	2px;
	vertical-align:	middle;
}

.sptable2.spezial tr > td:nth-child(3) {
	grid-column:		2;
	grid-row:		span 3;
	background-color:	#fff;
	border-top-width:	1px;
	border-right-width:	1px;
	border-bottom-width:	0;
	border-left-width:	0px;
}

.sptable2.spezial tr.no1cell > td:nth-child(2) {
	grid-column:		2;
	grid-row:		span 3;
	background-color:	#fff;
	border-top-width:	1px;
	border-right-width:	1px;
	border-bottom-width:	0;
	border-left-width:	0px;
}

.sptable2.spezial tr > td:nth-child(4),
.sptable2.spezial tr.no1cell > td:nth-child(3) {
	grid-column:		3/7;
	background-color:	#fff;
	border-top-width:	1px;
	border-right-width:	1px;
	border-bottom-width:	0;
	border-left-width:	0px;
}

.sptable2.spezial tr > td:nth-child(5),
.sptable2.spezial tr.no1cell > td:nth-child(4) {
	grid-column:		3/7;
	background-color:	#fff;
	border-top-width:	1px;
	border-right-width:	1px;
	border-bottom-width:	0;
	border-left-width:	0px;
}

.sptable2.spezial tr > td:nth-child(6),
.sptable2.spezial tr.no1cell > td:nth-child(5) {
	grid-column:		3/7;
	background-color:	#fff;
	border-top-width:	1px;
	border-right-width:	2px;
	border-bottom-width:	0;
	border-left-width:	0px;
}

.sptable2.spezial tr > td:nth-child(7),
.sptable2.spezial tr.no1cell > td:nth-child(6) {
	grid-column:		1/4;
	background-color:	#fff;
	border-top-width:	1px;
	border-right-width:	1px;
	border-bottom-width:	2px;
	border-left-width:	2px;
}

.sptable2.spezial tr > td:nth-child(8),
.sptable2.spezial tr.no1cell > td:nth-child(7) {
	grid-column:		4;
	background-color:	#fff;
	border-top-width:	1px;
	border-right-width:	1px;
	border-bottom-width:	2px;
	border-left-width:	0px;
}

.sptable2.spezial tr > td:nth-child(9),
.sptable2.spezial tr.no1cell > td:nth-child(8) {
	grid-column:		5;
	background-color:	#fff;
	border-top-width:	1px;
	border-right-width:	1px;
	border-bottom-width:	2px;
	border-left-width:	0px;
}

.sptable2.spezial tr > td:nth-child(10),
.sptable2.spezial tr.no1cell > td:nth-child(9) {
	grid-column:		6;
	background-color:	#fff;
	border-top-width:	1px;
	border-right-width:	2px;
	border-bottom-width:	2px;
	border-left-width:	0px;
}

.sptable2.spezial tr > td:last-child {
	border-bottom-width:	2px;
}

.sptable2.spezial tr:first-child > td:nth-child(1) {
	display:		none;
}

.sptable2.spezial tr:first-child > td:nth-child(2),
.sptable2.spezial tr:first-child > td:nth-child(3),
.sptable2.spezial tr:first-child > td:nth-child(4),
.sptable2.spezial tr:first-child > td:nth-child(5),
.sptable2.spezial tr:first-child > td:nth-child(6) {
	border-top-width:	2px !important;
}

.sptable2.spezial tr:first-child > th {
	background-color:	#ccc;
}


} /*** Ende Formatierungen für max 576 ***/
Abgerufen von „https://wiki.securepoint.de/index.php?title=Vorlage:Portfilter.css&oldid=79861“