User:4erospace/common.css: Difference between revisions
m CSS test |
m CSS test |
||
Line 1: | Line 1: | ||
/* Core functionality */ | |||
#animated-text-strip{ | |||
display: flex; | |||
flex-flow: row nowrap; | |||
align-items: center; | |||
overflow: hidden; | overflow: hidden; | ||
} | } | ||
#animated-text-strip .marquee { | |||
.marquee | white-space: nowrap; | ||
animation: marquee 5s linear infinite; | |||
max-width: none; | |||
animation: marquee | |||
} | } | ||
Line 25: | Line 21: | ||
} | } | ||
/* Styles for the sake of the demonstration */ | |||
#animated-text-strip{ | |||
background:black; | |||
padding: 1rem 0; | |||
} | } | ||
.marquee{ | |||
. | font-family: 'Open Sans', sans-serif; | ||
font-size: 2rem; | |||
font-weight: 900; | |||
text-transform: uppercase; | |||
color: white; | |||
} | } |
Revision as of 06:22, 17 June 2025
/* Core functionality */
#animated-text-strip{
display: flex;
flex-flow: row nowrap;
align-items: center;
overflow: hidden;
}
#animated-text-strip .marquee {
white-space: nowrap;
animation: marquee 5s linear infinite;
max-width: none;
}
@keyframes marquee {
0% {
transform: translate(0, 0);
}
100% {
transform: translate(-100%, 0);
}
}
/* Styles for the sake of the demonstration */
#animated-text-strip{
background:black;
padding: 1rem 0;
}
.marquee{
font-family: 'Open Sans', sans-serif;
font-size: 2rem;
font-weight: 900;
text-transform: uppercase;
color: white;
}