Main Page/styles.css: Difference between revisions
Jump to navigation
Jump to search
No edit summary |
No edit summary |
||
| Line 4: | Line 4: | ||
} | } | ||
.text-container { | .text-container { | ||
width: | width: 100%; | ||
overflow: hidden; | overflow: hidden; | ||
white-space: nowrap; | white-space: nowrap; | ||
| Line 13: | Line 13: | ||
.text { | .text { | ||
display: inline-block; | display: inline-block; | ||
font-size: 24px; | font-size: 24px; | ||
animation: scroll | padding: 0 10px; | ||
box-sizing: border-box; | |||
animation: scroll 9s infinite; | |||
} | } | ||
@keyframes scroll { | @keyframes scroll { | ||
0%, | 0%, 11.11% { | ||
transform: translateX(0); | transform: translateX(0); | ||
} | } | ||
33.33 | 22.22%, 33.33% { | ||
transform: translateX(-100%); | transform: translateX(-100%); | ||
} | } | ||
44.44%, 55.55% { | |||
transform: translateX(-200%); | transform: translateX(-200%); | ||
} | |||
66.66%, 77.77% { | |||
transform: translateX(-300%); | |||
} | } | ||
} | } | ||
Revision as of 23:48, 24 October 2024
.mainpage-title{
font-size:1.6em;
font-weight: bold;
}
.text-container {
width: 100%;
overflow: hidden;
white-space: nowrap;
margin: 0 auto;
position: relative;
}
.text {
display: inline-block;
font-size: 24px;
padding: 0 10px;
box-sizing: border-box;
animation: scroll 9s infinite;
}
@keyframes scroll {
0%, 11.11% {
transform: translateX(0);
}
22.22%, 33.33% {
transform: translateX(-100%);
}
44.44%, 55.55% {
transform: translateX(-200%);
}
66.66%, 77.77% {
transform: translateX(-300%);
}
}