WordPress.org

Make WordPress Core

Ticket #17564: 17564.responsive-gallery-shortcode.diff

File 17564.responsive-gallery-shortcode.diff, 1.7 KB (added by mfields, 4 years ago)

Allow gallery shortcode to respond up to 9 columns.

  • wp-content/themes/twentyeleven/style.css

     
    14951495    display: block; 
    14961496    margin: 0 auto 1.625em; 
    14971497} 
     1498.gallery-columns-4 .gallery-item { 
     1499        width:23% !important; 
     1500        padding-right:2% !important; 
     1501} 
     1502.gallery-columns-5 .gallery-item { 
     1503        width:18% !important; 
     1504        padding-right:2% !important; 
     1505} 
     1506.gallery-columns-6 .gallery-item { 
     1507        width:14% !important; 
     1508        padding-right:2% !important; 
     1509} 
     1510.gallery-columns-7 .gallery-item { 
     1511        width:12% !important; 
     1512        padding-right:2% !important; 
     1513} 
     1514.gallery-columns-8 .gallery-item { 
     1515        width:10% !important; 
     1516        padding-right:2% !important; 
     1517} 
     1518.gallery-columns-9 .gallery-item { 
     1519        width:9% !important; 
     1520        padding-right:2% !important; 
     1521} 
     1522.gallery-columns-4 .gallery-item img, 
     1523.gallery-columns-5 .gallery-item img, 
     1524.gallery-columns-6 .gallery-item img, 
     1525.gallery-columns-7 .gallery-item img, 
     1526.gallery-columns-8 .gallery-item img, 
     1527.gallery-columns-9 .gallery-item img { 
     1528        width:100% !important; 
     1529        height:auto !important; 
     1530} 
    14981531 
    14991532 
    15001533/* =Navigation 
     
    21852218                position: absolute; 
    21862219                top: 2.2em; 
    21872220        } 
     2221        .gallery-columns-3 .gallery-item { 
     2222                width:31% !important; 
     2223                padding-right:2% !important; 
     2224        } 
     2225        .gallery-columns-3 .gallery-item img { 
     2226                width:100% !important; 
     2227                height:auto !important; 
     2228        } 
    21882229} 
     2230@media (max-width: 450px) { 
     2231        .gallery-columns-2 .gallery-item { 
     2232                width:45% !important; 
     2233                padding-right:4% !important; 
     2234        } 
     2235        .gallery-columns-2 .gallery-item img { 
     2236                width:100% !important; 
     2237                height:auto !important; 
     2238        } 
     2239} 
    21892240@media only screen and (min-device-width: 320px) and (max-device-width: 480px) { 
    21902241        body { 
    21912242                padding: 0 .5em;