fix non-working rwd

This commit is contained in:
janis
2023-03-09 11:56:11 +01:00
parent ba1c8153a9
commit 252a2745c7
2 changed files with 43 additions and 32 deletions

View File

@@ -118,6 +118,10 @@ body {
text-align: center;
}
.unstyled-html, .create {
width: 100%;
}
/* This div will have crazy cool style, as this should represent that you can use (almost) all the CSS you want.*/
.create .special-style {
background-color: aqua;
@@ -191,8 +195,13 @@ body {
.sidebyside-element {
width: 40%;
}
}
code {
text-align: justify;
}
code, pre {
max-width: 80vw;
}

View File

@@ -28,17 +28,22 @@
</div>
</div>
<div class="content">
<!--FEATURE OVERVIEW-->
<div class="centered">
<div class="create">
<div class="unstyled-html">
<h3>Use HTML</h3>
<!--TODO: Add html demo code-->
<pre>
<code>
&lt;div id=&quot;impress&quot;&gt;
&lt;div id=&quot;impress&quot;&gt;
&lt;div class=&quot;step&quot;&gt;
&lt;h1&gt;impress.js - The JavaScript presentation framework&lt;/h1&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;/div&gt;
</code>
</pre>
</div>
@@ -46,24 +51,21 @@
<h3 style="font-size: 200%;">And CSS</h3>
<pre>
<code>
.impress-supported .fallback-message {
.impress-supported .fallback-message {
display: none;
}
}
.step {
.step {
width: 80vw;
height: 80vh;
background-color: white;
}
}
</code>
</pre>
</div>
<p>To create stunning presentations</p>
</div>
<!--FEATURE OVERVIEW-->
<div class="centered">
<div class="sidebyside">
<div class="sidebyside-element">
<h3>FULL power of CSS.</h3>