Browse Source

Адаптивная вёрстка

master
Maxim Lihachev 9 years ago
parent
commit
5212200a07
  1. 32
      css/feminitives.css

32
css/feminitives.css

@ -63,8 +63,7 @@ button:hover {
#definition-help { #definition-help {
text-align: justify; text-align: justify;
font-size: 40%; margin-top: -32% !important;
margin-top: -58% !important;
} }
#definition-dict { #definition-dict {
@ -78,7 +77,7 @@ button:hover {
#definition-image { #definition-image {
width: 50%; width: 50%;
margin: 0 auto; margin: 0 auto;
padding: 0.5%; padding: 1.5%;
width: 400px; width: 400px;
background-color: white; background-color: white;
} }
@ -91,13 +90,6 @@ button:hover {
width: 400px; width: 400px;
} }
@media screen and (max-device-width: 800px) {
#definition-card {
height: 220px;
width: 300px;
}
}
#definition-card h1 { #definition-card h1 {
position: relative; position: relative;
text-align: right; text-align: right;
@ -125,12 +117,13 @@ button:hover {
font-size: 250%; font-size: 250%;
font-weight: regular; font-weight: regular;
text-align: center; text-align: center;
visibility: visible;
} }
#definition-full { #definition-full {
font-size: 100%; font-size: 100%;
height: 40px; height: 60px;
margin-top: 1%; margin-top: 5%;
} }
.toolbar, .toolbar:visited { .toolbar, .toolbar:visited {
@ -145,3 +138,18 @@ button:hover {
opacity: 1; opacity: 1;
} }
@media screen and (max-device-width: 1000px) {
input { font-size:90%; }
button { font-size: 80%; }
#definition-full { height: 80px; margin-top: 40px; }
}
@media screen and (max-device-width: 800px) {
#definition { width: 90%; }
#definition h1 { font-size: 150%; }
#definition-help { font-size: 95%; }
#definition-card h1 { line-height: 65%; }
#definition-card h1 span{ font-size: 60%; }
}

Loading…
Cancel
Save