pedf
/
pomocskolam
Archived
1
0
Fork 0

Responzivita

form
Emil Miler 4 years ago
parent 9a5b623f9c
commit 9ceafa746b

@ -48,7 +48,7 @@ header {
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: space-around; justify-content: space-around;
padding: 4em 0; padding: 4em 1rem;
max-width: 100em; max-width: 100em;
width: 100%; width: 100%;
@ -75,6 +75,7 @@ main {
margin-bottom: 5em; margin-bottom: 5em;
max-width: 50em; max-width: 50em;
width: 100%; width: 100%;
padding: 1rem;
h1, h2 { h1, h2 {
margin-top: 2em; margin-top: 2em;
@ -87,7 +88,7 @@ main {
margin-left: -50vw; margin-left: -50vw;
background-color: #C61730; background-color: #C61730;
color: #fff; color: #fff;
padding: 4em 0; padding: 4em 1rem;
text-align: center; text-align: center;
h1 { h1 {
@ -203,3 +204,24 @@ footer {
max-width: 55em; max-width: 55em;
margin: 0 auto; margin: 0 auto;
} }
@media screen and (max-width: 999px) {
header {
flex-direction: column;
img { display: none; }
nav {
width: 100%;
ul { flex-direction: column; }
}
}
main form {
display: flex;
flex-direction: column;
div { margin-bottom: 2em; }
}
}

@ -3,6 +3,7 @@
<html lang="cs"> <html lang="cs">
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>{{ config.title }}</title> <title>{{ config.title }}</title>
<link rel="stylesheet" href="/style.css"> <link rel="stylesheet" href="/style.css">
<link rel="icon" href="/favicon.ico"> <link rel="icon" href="/favicon.ico">