Шаблон:Схема годоса/hodoscheme.css: различия между версиями

Материал из Янтарной ноосферы, свободной интернет-энциклопедии
никакого обтекания для лево-правого блока
на самом деле флекс просто чуть более красивые костыли, чем было до этого
Строка 15: Строка 15:
row-gap: 0.5em;
row-gap: 0.5em;
background: lightgray;
background: lightgray;
font-size: small;
}
}
.hsElements > li{
.hsElements > li{
display: inline-block;
display: inline-block;
height: 6em;
height: 9em;
max-height: 6em;
flex-grow: 1;
flex-grow: 1;
}
}
Строка 27: Строка 27:
li#hsEnd,
li#hsEnd,
li#hsAfterEnd{
li#hsAfterEnd{
display: inline-block;
display: inline flex;
text-align: center;
align-items: center;
width: 6em;
}
}
.hsGroup > ol{
.hsGroup > ol{
display: block;
display: flex;
height: 50%;
height: 50%;
}
}
Строка 40: Строка 41:
margin: 0 auto;
margin: 0 auto;
height: 100%;
height: 100%;
max-width: 11em;
text-align: center;
flex: 1 0 auto;
}
}
#hsStartTop{
#hsStartTop{
Строка 63: Строка 67:
text-decoration: none;
text-decoration: none;
display: inline-block;
display: inline-block;
height: 100%;
margin: 0 auto;
margin: 0 auto;
}
}

Версия от 19:45, 1 декабря 2024

.hsBody li,
.hsBody ol{
	list-style-type: none;
	margin: 0;
}
/* структура схемы */
.hsBody,
#hsCaption,
#hsTitle{
	width: 100%;
}
.hsElements{
	display: flex;
	flex-wrap: wrap;
	row-gap: 0.5em;
	background: lightgray;
	font-size: small;
}
.hsElements > li{
	display: inline-block;
	height: 9em;
	flex-grow: 1;
}
li#hsBeforeStart,
li#hsStart,
li.hsCross,
li#hsEnd,
li#hsAfterEnd{
	display: inline flex;
	align-items: center;
	width: 6em;
}
.hsGroup > ol{
	display: flex;
	height: 50%;
}
.hsGroupLeft > li,
.hsGroupRight > li{
	display: block;
	float: left;
	margin: 0 auto;
	height: 100%;
	max-width: 11em;
	text-align: center;
	flex: 1 0 auto;
}
#hsStartTop{

}
#hsStartBottom{

}
.budynek{
	background-color: yellow;
}
.park{
	background-color: green;
}
.hydro{
	background-color: blue;
}
.terytorium{
	background-color: gray;
}
.hsElements a{
	color: black;
	text-decoration: none;
	display: inline-block;
	margin: 0 auto;
}
#hsEnd{

}
#hsEndTop{

}
#hsEndBottom{

}
#hsAfterEnd{

}