نمایش مبدأ برای الگو:شعر جدید/styles.css

.poetry-wrapper {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  text-align: justify;
  text-align-last: justify;
  margin: auto;
}

.poetry-wrapper.mashtoor {
	grid-template-columns: 1fr;
	padding-left: 0;
}

.poetry-wrapper.free {
	grid-template-columns: 1fr;
	padding-left: 0;
	text-align: right;
	text-align-last: right;
}

.poetry-single_bayt {
  grid-column: 2 / 4;
  padding-left: 0.5em;
  padding-right: 0.5em;
}
.poetry-wrapper > div {
    white-space: nowrap;
    break-inside: avoid;
    page-break-inside:avoid;
}

.poetry-sdr {
	grid-column: 1 / 3;
    padding-left: 1em;
}

.poetry-ajz {
	grid-column: 3 / 5;
    padding-right: 1em;
}

/* تنسيق شطر شطر */
.poetry-wrapper.poetry-shaterbyshater {
	grid-template-columns: 1fr;
}

.poetry-shaterbyshater .poetry-single_bayt {
  grid-column: unset;
  padding-left: 2.5em;
  padding-right: 2.5em;
}
.poetry-shaterbyshater .poetry-sdr {
	grid-column: unset;
    padding-left: 5em;
}
.poetry-shaterbyshater .poetry-ajz {
	grid-column: unset;
    padding-right: 5em;
}
@media screen and (max-width: 600px) {
	.poetry-wrapper {
		grid-template-columns: 1fr;
	}

	.poetry-single_bayt {
 grid-column: unset;
 padding-left: 2.5em;
 padding-right: 2.5em;
	}
	.poetry-sdr {
		grid-column: unset;
 padding-left: 5em;
	}
	.poetry-ajz {
		grid-column: unset;
 padding-right: 5em;
	}
}

@media screen and (max-width: 400px) {
	.poetry-wrapper, .poetry-wrapper.poetry-shaterbyshater {
		font-size: small;
	}
}