css fill possible for mouses, unlikely for banners

This commit is contained in:
asus
2023-11-19 17:53:47 +01:00
parent f027ca2752
commit ea781e2aac
4 changed files with 78 additions and 70 deletions

View File

@@ -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>

View File

@@ -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;

View File

@@ -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  ";

View File

@@ -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;
} }