add: horizontal scroll on mobile
This commit is contained in:
parent
0c9f52cb03
commit
9ab1a74bc1
@ -14,7 +14,6 @@
|
|||||||
<p>Wiedźmy to w dawnych wierzeniach istoty półdemoniczne - istoty pośrednie między demonami a ludźmi, pozostające w ścisłym związku z ludźmi lub ich duszami. Oprócz relacji z diabłami i potworami, które dawały wiedźmą magiczne zdolności - potrafiły one rzucać uroki, zaklęcia, przepowiadać przyszłość, a nawet rozmawiać ze zmarłymi. Potocznie mówimy tak na kobiety niemiłe i/lub brzydkie. Według dawnych wierzeń ludowych wiedźma to kobieta podlegająca wpływom diabła, mająca moc rzucania uroków.</p>
|
<p>Wiedźmy to w dawnych wierzeniach istoty półdemoniczne - istoty pośrednie między demonami a ludźmi, pozostające w ścisłym związku z ludźmi lub ich duszami. Oprócz relacji z diabłami i potworami, które dawały wiedźmą magiczne zdolności - potrafiły one rzucać uroki, zaklęcia, przepowiadać przyszłość, a nawet rozmawiać ze zmarłymi. Potocznie mówimy tak na kobiety niemiłe i/lub brzydkie. Według dawnych wierzeń ludowych wiedźma to kobieta podlegająca wpływom diabła, mająca moc rzucania uroków.</p>
|
||||||
<h2>Dzień wiedźmy obchodzimy 16 listopada. <span id="difference"></span></h2>
|
<h2>Dzień wiedźmy obchodzimy 16 listopada. <span id="difference"></span></h2>
|
||||||
</div>
|
</div>
|
||||||
<img src="wiedzma.png" alt="Wiedźma" id="witch">
|
|
||||||
<div class="info-block">
|
<div class="info-block">
|
||||||
<h1>Ciekawostki o wiedźmach</h1>
|
<h1>Ciekawostki o wiedźmach</h1>
|
||||||
<ol>
|
<ol>
|
||||||
@ -30,6 +29,7 @@
|
|||||||
<li>Ostatnią spaloną na stosie „czarownicą” w Europie była Barbara Zdunk.</li>
|
<li>Ostatnią spaloną na stosie „czarownicą” w Europie była Barbara Zdunk.</li>
|
||||||
</ol>
|
</ol>
|
||||||
</div>
|
</div>
|
||||||
|
<img src="wiedzma.png" alt="Wiedźma" id="witch">
|
||||||
</div>
|
</div>
|
||||||
<footer>Nie próbuj klikać prawego przycisku myszy! 😈</footer>
|
<footer>Nie próbuj klikać prawego przycisku myszy! 😈</footer>
|
||||||
</body>
|
</body>
|
||||||
|
27
style.css
27
style.css
@ -48,14 +48,14 @@ body h1:first-child {
|
|||||||
flex-direction: row;
|
flex-direction: row;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
.info-block {
|
.info-block {
|
||||||
background-color: var(--info-block-bg);
|
background-color: var(--info-block-bg);
|
||||||
border-radius: var(--info-block-border);
|
border-radius: var(--info-block-border);
|
||||||
border-bottom-right-radius: 0;
|
height: 50%;
|
||||||
border-top-right-radius: 0;
|
|
||||||
max-height: 40vw;
|
|
||||||
overflow: auto;
|
overflow: auto;
|
||||||
padding: 20px;
|
padding: 20px;
|
||||||
margin: 10px;
|
margin: 10px;
|
||||||
@ -107,4 +107,25 @@ footer {
|
|||||||
|
|
||||||
::-webkit-scrollbar-corner {
|
::-webkit-scrollbar-corner {
|
||||||
background: transparent;
|
background: transparent;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media screen and (max-width: 978px) {
|
||||||
|
#container {
|
||||||
|
flex-direction: column;
|
||||||
|
overflow-y: hidden;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
}
|
||||||
|
|
||||||
|
.info-block {
|
||||||
|
max-height: 50%;
|
||||||
|
}
|
||||||
|
|
||||||
|
footer {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
body {
|
||||||
|
overflow-y: hidden;
|
||||||
|
overflow-x: auto;
|
||||||
|
}
|
||||||
}
|
}
|
Loading…
x
Reference in New Issue
Block a user