mirror of
https://github.com/moparisthebest/wallabag
synced 2024-12-24 08:18:48 -05:00
mise en page adaptive
This commit is contained in:
parent
c594aedf8c
commit
c587d27c6d
@ -55,18 +55,18 @@ footer {
|
|||||||
/*** GRID DISPLAY ***/
|
/*** GRID DISPLAY ***/
|
||||||
|
|
||||||
#content {
|
#content {
|
||||||
width: 800px;
|
width: 1000px;
|
||||||
margin: 0 auto;
|
margin: 0 auto;
|
||||||
}
|
}
|
||||||
|
|
||||||
#entries {
|
#entries {
|
||||||
-moz-column-count: 3;
|
-moz-column-count: 4;
|
||||||
-moz-column-gap: 20px;
|
-moz-column-gap: 20px;
|
||||||
-webkit-column-count: 3;
|
-webkit-column-count: 4;
|
||||||
-webkit-column-gap: 20px;
|
-webkit-column-gap: 20px;
|
||||||
column-count: 3;
|
column-count: 4;
|
||||||
column-gap: 20px;
|
column-gap: 20px;
|
||||||
width: 800px;
|
width: 1000px;
|
||||||
}
|
}
|
||||||
|
|
||||||
#entries span.content {
|
#entries span.content {
|
||||||
@ -75,6 +75,58 @@ footer {
|
|||||||
width: 100%;
|
width: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@media only screen and (max-width : 1199px),
|
||||||
|
only screen and (max-device-width : 1199px){
|
||||||
|
#entries {
|
||||||
|
-moz-column-count: 5;
|
||||||
|
-moz-column-gap: 20px;
|
||||||
|
-webkit-column-count: 5;
|
||||||
|
-webkit-column-gap: 20px;
|
||||||
|
column-count: 5;
|
||||||
|
column-gap: 20px;
|
||||||
|
width: 1000px;
|
||||||
|
}
|
||||||
|
|
||||||
|
#content {
|
||||||
|
width: 1000px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
@media only screen and (max-width : 999px),
|
||||||
|
only screen and (max-device-width : 999px){
|
||||||
|
#entries {
|
||||||
|
-moz-column-count: 4;
|
||||||
|
-moz-column-gap: 15px;
|
||||||
|
-webkit-column-count: 4;
|
||||||
|
-webkit-column-gap: 15px;
|
||||||
|
column-count: 4;
|
||||||
|
column-gap: 15px;
|
||||||
|
width: 800px;
|
||||||
|
}
|
||||||
|
|
||||||
|
#content {
|
||||||
|
width: 800px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@media only screen and (max-width : 799px),
|
||||||
|
only screen and (max-device-width : 799px){
|
||||||
|
#entries {
|
||||||
|
-moz-column-count: 3;
|
||||||
|
-moz-column-gap: 10px;
|
||||||
|
-webkit-column-count: 3;
|
||||||
|
-webkit-column-gap: 10px;
|
||||||
|
column-count: 3;
|
||||||
|
column-gap: 10px;
|
||||||
|
width: 600px;
|
||||||
|
}
|
||||||
|
|
||||||
|
#content {
|
||||||
|
width: 600px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
@media only screen and (max-width : 599px),
|
@media only screen and (max-width : 599px),
|
||||||
only screen and (max-device-width : 599px){
|
only screen and (max-device-width : 599px){
|
||||||
#entries {
|
#entries {
|
||||||
|
Loading…
Reference in New Issue
Block a user