Skip to content

Instantly share code, notes, and snippets.

@ramsesoriginal

ramsesoriginal/dabblet.css

Created July 20, 2012 12:29
Show Gist options
  • Save ramsesoriginal/3150480 to your computer and use it in GitHub Desktop.
Save ramsesoriginal/3150480 to your computer and use it in GitHub Desktop.
Download ZIP
Marquee
Raw
dabblet.css
/**
* Marquee
*/
/* @group Marquee */
body,html, p {
margin: 0;
padding: 0;
}
.marquee {
height: 30px;
overflow: hidden;
position: relative;
color: #7F7B71;
font-size: 18px;
line-height: 18px;
margin:0;
padding:0;
}
.marquee-wrapper {
display: block;
width: 200%;
height: 30px;
position: absolute;
overflow: hidden;
animation: marquee 4s linear infinite;
}
.marquee1,.marquee2 {
float: left;
width: 50%;
}
.marquee .marquee1 *,
.marquee .marquee2 *{
display: inline-block;
}
@keyframes marquee {
0% { left: 0; }
100% { left: -100%; }
}
/* @end */
Raw
dabblet.html
<div class="marquee" style="width: 380px;">
<p class="marquee-wrapper">
<span class="marquee1">
<span>Test</span>
<div tyle="display: inline-block;">
Test
</div>
</span>
<span class="marquee2">
TestTest
</span>
</p>
</div>
<!-- content to be placed inside <body>…</body> -->
Raw
settings.json
{"view":"split","fontsize":"100","seethrough":"","prefixfree":"1","page":"css"}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment