css fill possible for mouses, unlikely for banners
This commit is contained in:
@@ -592,6 +592,7 @@
|
|||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
<!--
|
<!--
|
||||||
BANNER 4
|
BANNER 4
|
||||||
-->
|
-->
|
||||||
@@ -646,16 +647,14 @@
|
|||||||
-->
|
-->
|
||||||
|
|
||||||
|
|
||||||
<div class="ascii" id="test"></div>
|
|
||||||
|
|
||||||
<figure class="frames_container mouse" id="mouse_test">
|
<figure class="frames_container mouse" id="mouse_test">
|
||||||
<div class="ascii frame f1"></div>
|
<div class="ascii frame f1"></div><div class="ascii frame f2"></div><div class="ascii frame f3"></div><div class="ascii frame f4"></div>
|
||||||
<div class="ascii frame f2"></div>
|
|
||||||
<div class="ascii frame f3"></div>
|
|
||||||
<div class="ascii frame f4"></div>
|
|
||||||
</figure>
|
</figure>
|
||||||
|
|
||||||
|
|
||||||
|
<p>here</p>
|
||||||
|
<div id="test"></div>
|
||||||
|
|
||||||
|
|
||||||
</body>
|
</body>
|
||||||
|
|||||||
@@ -6,13 +6,11 @@
|
|||||||
.frames_container {
|
.frames_container {
|
||||||
display: grid;
|
display: grid;
|
||||||
width: fit-content;
|
width: fit-content;
|
||||||
|
|
||||||
/*
|
/*
|
||||||
border: 1px solid blue;
|
border: 1px solid blue;
|
||||||
*/
|
*/
|
||||||
}
|
}
|
||||||
.frame.hide {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
.frame {
|
.frame {
|
||||||
position: relative;
|
position: relative;
|
||||||
grid-column: 1;
|
grid-column: 1;
|
||||||
|
|||||||
@@ -1,11 +1,21 @@
|
|||||||
|
#test {
|
||||||
|
border: 1px solid blue;
|
||||||
|
width: 100px;
|
||||||
|
height: 100px;
|
||||||
|
background-image: url(" \
|
||||||
|
data:image/svg+xml;utf8, \
|
||||||
|
<svg xmlns='http://www.w3.org/2000/svg' version='1.1' height='50px' width='100%'>\
|
||||||
|
<text x='0' y='15'>\
|
||||||
|
I love SVG!\
|
||||||
|
</text>\
|
||||||
|
</svg>");
|
||||||
|
}
|
||||||
|
/*
|
||||||
#test::after {
|
#test::after {
|
||||||
content: " \a \a \a \a \a \a \a \a \a \a \a \a \a \a \a ";
|
content: " \a \a \a \a \a \a \a \a \a \a \a \a \a \a \a ";
|
||||||
white-space: pre;
|
white-space: pre;
|
||||||
}
|
}
|
||||||
|
*/
|
||||||
.mouse .frame {
|
|
||||||
white-space: pre;
|
|
||||||
}
|
|
||||||
|
|
||||||
#mouse_test .frame.f1::before {
|
#mouse_test .frame.f1::before {
|
||||||
content: " \A \A \A \A \A \A \A \A \A \A \A \A \A ";
|
content: " \A \A \A \A \A \A \A \A \A \A \A \A \A ";
|
||||||
|
|||||||
@@ -39,4 +39,5 @@ h6 { margin: 10px 0px; font-size: 1.0rem; }
|
|||||||
pre, .ascii {
|
pre, .ascii {
|
||||||
line-height: 0.8;
|
line-height: 0.8;
|
||||||
font-size: min(2.2vw, 1.0rem);
|
font-size: min(2.2vw, 1.0rem);
|
||||||
|
white-space: pre;
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user