Improvements to responsive styling on my-sites.php.
* Ensure that floated elements break to a new line at the end of a row. * Allow enough vertical space for long site titles. * Give more breathing room to cells at narrow widths. Fixes #31685. git-svn-id: https://develop.svn.wordpress.org/trunk@33135 602fd350-edb4-49c9-b593-d223f7449a82
This commit is contained in:
parent
ccbd855021
commit
002dd563e0
@ -3042,15 +3042,21 @@ img {
|
||||
display: block;
|
||||
overflow: auto;
|
||||
zoom: 1;
|
||||
border: 1px solid #e5e5e5;
|
||||
}
|
||||
|
||||
.my-sites li {
|
||||
display: block;
|
||||
padding: 8px 1%;
|
||||
padding: 8px 3%;
|
||||
min-height: 130px;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 599px) {
|
||||
.my-sites li {
|
||||
min-height: 0;
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (min-width: 600px) {
|
||||
.my-sites.striped li {
|
||||
background-color: #fff;
|
||||
@ -3070,11 +3076,14 @@ img {
|
||||
@media only screen and (min-width: 600px) and (max-width: 699px) {
|
||||
.my-sites li{
|
||||
float: left;
|
||||
width: 48%;
|
||||
width: 44%;
|
||||
}
|
||||
.my-sites.striped li {
|
||||
background-color: #fff;
|
||||
}
|
||||
.my-sites.striped li:nth-of-type(2n+1) {
|
||||
clear: left;
|
||||
}
|
||||
.my-sites.striped li:nth-of-type(2n+2):after {
|
||||
content: none;
|
||||
}
|
||||
@ -3088,7 +3097,7 @@ img {
|
||||
@media only screen and (min-width: 700px) and (max-width: 1199px) {
|
||||
.my-sites li {
|
||||
float: left;
|
||||
width: 31.333333%;
|
||||
width: 27.333333%;
|
||||
background-color: #fff;
|
||||
}
|
||||
.my-sites.striped li:nth-of-type(3n+3):after {
|
||||
@ -3104,9 +3113,13 @@ img {
|
||||
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
|
||||
.my-sites li {
|
||||
float: left;
|
||||
width: 23%;
|
||||
width: 21%;
|
||||
padding: 8px 2%;
|
||||
background-color: #fff;
|
||||
}
|
||||
.my-sites.striped li:nth-of-type(4n+1) {
|
||||
clear: left;
|
||||
}
|
||||
.my-sites.striped li:nth-of-type(4n+4):after {
|
||||
content: none;
|
||||
}
|
||||
@ -3121,9 +3134,13 @@ img {
|
||||
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
|
||||
.my-sites li {
|
||||
float: left;
|
||||
width: 18%;
|
||||
width: 16%;
|
||||
padding: 8px 2%;
|
||||
background-color: #fff;
|
||||
}
|
||||
.my-sites.striped li:nth-of-type(5n+1) {
|
||||
clear: left;
|
||||
}
|
||||
.my-sites.striped li:nth-of-type(5n+5):after {
|
||||
content: none;
|
||||
}
|
||||
@ -3139,9 +3156,13 @@ img {
|
||||
@media only screen and (min-width: 1600px) {
|
||||
.my-sites li {
|
||||
float: left;
|
||||
width: 14.666666%;
|
||||
width: 12.666666%;
|
||||
padding: 8px 2%;
|
||||
background-color: #fff;
|
||||
}
|
||||
.my-sites.striped li:nth-of-type(6n+1) {
|
||||
clear: left;
|
||||
}
|
||||
.my-sites.striped li:nth-of-type(6n+6):after {
|
||||
content: none;
|
||||
}
|
||||
|
Loading…
Reference in New Issue
Block a user