nicht angemeldet
Hallo,
die Marken wirst du zu jedem Veranstaltungstermin individuell anpassen müssen. Aber das geht ja recht übersichtlich.
Der Drehpunkt über die linke obere Ecke passt.
Die Position der Marken würde ich über transform translate anpassen.
Ich habe mal ein Beispiel erstellt, die Anpassungen für dich solltest du hinbekommen. Ansonsten kannst du ja noch mal nachfragen.
<!DOCTYPE html>
<html lang="de">
<head>
<meta charset="utf-8">
<title>Buttongestaltung 01</title>
<meta name="description" content="HTML5, CSS3">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!--[if lt IE 9]>
<script src="http://html5shiv-printshiv.googlecode.com/svn/trunk/html5shiv-printshiv.js"></script>
<![endif]-->
<style>
@media all {
header, nav, main, aside, footer, section, article, figure, figcaption, audio, video {
display: block;
}
* {
box-sizing: border-box;
}
html {
font-size: 120%; /*für die Einheit rem, mit der ich gerne arbeite*/
}
body {
position: relative;
width: 14cm;
height: 25cm;
padding: 0;
border: 1px solid black;
margin: 1cm 0 0 0;
}
footer {
position: absolute;
bottom: 0;
left: 0px;
width: 100%;
}
footer p {
display: inline-block;
position: absolute;
padding: 0;
margin: 0;
transform-origin: 0% 0%;
}
footer p:nth-child(1) {
transform: rotate(270deg) translate(10px, 10px);
}
footer p:nth-child(2) {
transform: rotate(270deg) translate(10px, 50px);
}
footer p:nth-child(3) {
transform: rotate(270deg) translate(10px, 120px);
}
footer p:nth-child(3) span:nth-child(1) {
color: red;
}
footer p:nth-child(3) span:nth-child(2) {
font-weight: bolder;
}
footer p:nth-child(4) {
transform: rotate(270deg) translate(10px, 160px);
}
footer p:nth-child(5) {
transform: rotate(270deg) translate(10px, 200px);
}
footer p:nth-child(6) {
transform: rotate(270deg) translate(10px, 240px);
}
}
</style>
</head>
<body>
<main>
<h1>Überschrift</h1>
<p>In Deutschland gibt es rund 120.000 Vermögensmillionäre. Sie gelten als die Reichen im Lande. Damit sind ihnen zwei Dinge ganz sicher: Neid und immer neue Begehrlichkeiten des Fiskus. Wer da glaubt, von einer Million als Bonvivant gut leben zu können, der kennt das deutsche Steuerrecht schlecht. Stellen wir uns den steuerehrlichen Herrn Michel vor, der eine Million erarbeitet oder geerbt hat.</p>
<p>In Deutschland gibt es rund 120.000 Vermögensmillionäre. Sie gelten als die Reichen im Lande. Damit sind ihnen zwei Dinge ganz sicher: Neid und immer neue Begehrlichkeiten des Fiskus. Wer da glaubt, von einer Million als Bonvivant gut leben zu können, der kennt das deutsche Steuerrecht schlecht. Stellen wir uns den steuerehrlichen Herrn Michel vor, der eine Million erarbeitet oder geerbt hat.</p>
<p>In Deutschland gibt es rund 120.000 Vermögensmillionäre. Sie gelten als die Reichen im Lande. Damit sind ihnen zwei Dinge ganz sicher: Neid und immer neue Begehrlichkeiten des Fiskus. Wer da glaubt, von einer Million als Bonvivant gut leben zu können, der kennt das deutsche Steuerrecht schlecht. Stellen wir uns den steuerehrlichen Herrn Michel vor, der eine Million erarbeitet oder geerbt hat.</p>
</main>
<footer>
<p>Tel. 0123 456789 0000 000</p>
<p>Tel. 0123 456789 0000 <br>0134 34ö 34ö5</p>
<p>Tel. <span>0123</span> 456789 <span>0000</span></p>
<p>Tel. 0123 456789 0000</p>
<p>Tel. 0123 456789 0000</p>
<p>Tel. 0123 456789 0000</p>
</footer>
</body>
</html>
Gruss
MrMurphy