Make WordPress Core

Ticket #27462: 27462.fourteen.2.diff

File 27462.fourteen.2.diff, 3.1 KB (added by celloexpressions, 13 years ago)

Fix alignment of gallery images in Twenty Fourteen, matching approach taken for Twenty Thirteen

  • wp-content/themes/twentyfourteen/css/editor-style.css

     
    443443
    444444.gallery-columns-2 .gallery-item {
    445445        max-width: 48%;
    446         max-width: -webkit-calc(50% - 4px);
    447         max-width:         calc(50% - 4px);
     446        max-width: -webkit-calc(50% - 14px);
     447        max-width:         calc(50% - 14px);
    448448        width: auto;
    449449}
    450450
    451451.gallery-columns-3 .gallery-item {
    452452        max-width: 32%;
    453         max-width: -webkit-calc(33.3% - 4px);
    454         max-width:         calc(33.3% - 4px);
     453        max-width: -webkit-calc(33.3% - 11px);
     454        max-width:         calc(33.3% - 11px);
    455455        width: auto;
    456456}
    457457
    458458.gallery-columns-4 .gallery-item {
    459459        max-width: 23%;
    460         max-width: -webkit-calc(25% - 4px);
    461         max-width:         calc(25% - 4px);
     460        max-width: -webkit-calc(25% - 9px);
     461        max-width:         calc(25% - 9px);
    462462        width: auto;
    463463}
    464464
    465465.gallery-columns-5 .gallery-item {
    466466        max-width: 19%;
    467         max-width: -webkit-calc(20% - 4px);
    468         max-width:         calc(20% - 4px);
     467        max-width: -webkit-calc(20% - 8px);
     468        max-width:         calc(20% - 8px);
    469469        width: auto;
    470470}
    471471
    472472.gallery-columns-6 .gallery-item {
    473473        max-width: 15%;
    474         max-width: -webkit-calc(16.7% - 4px);
    475         max-width:         calc(16.7% - 4px);
     474        max-width: -webkit-calc(16.7% - 7px);
     475        max-width:         calc(16.7% - 7px);
    476476        width: auto;
    477477}
    478478
    479479.gallery-columns-7 .gallery-item {
    480480        max-width: 13%;
    481         max-width: -webkit-calc(14.28% - 4px);
    482         max-width:         calc(14.28% - 4px);
     481        max-width: -webkit-calc(14.28% - 7px);
     482        max-width:         calc(14.28% - 7px);
    483483        width: auto;
    484484}
    485485
    486486.gallery-columns-8 .gallery-item {
    487487        max-width: 11%;
    488         max-width: -webkit-calc(12.5% - 4px);
    489         max-width:         calc(12.5% - 4px);
     488        max-width: -webkit-calc(12.5% - 6px);
     489        max-width:         calc(12.5% - 6px);
    490490        width: auto;
    491491}
    492492
    493493.gallery-columns-9 .gallery-item {
    494494        max-width: 9%;
    495         max-width: -webkit-calc(11.1% - 4px);
    496         max-width:         calc(11.1% - 4px);
     495        max-width: -webkit-calc(11.1% - 6px);
     496        max-width:         calc(11.1% - 6px);
    497497        width: auto;
    498498}
    499499
     
    511511
    512512.gallery-columns-1 .gallery-item:nth-of-type(1n),
    513513.gallery-columns-2 .gallery-item:nth-of-type(2n - 1),
    514 .gallery-columns-3 .gallery-item:nth-of-type(3n - 2) {
    515         margin-left: 14px; /* Compensate for the default negative margin on .gallery, which can't be changed. */
    516 }
    517 
     514.gallery-columns-3 .gallery-item:nth-of-type(3n - 2),
    518515.gallery-columns-4 .gallery-item:nth-of-type(4n - 3),
    519516.gallery-columns-5 .gallery-item:nth-of-type(5n - 4),
    520517.gallery-columns-6 .gallery-item:nth-of-type(6n - 5),
     
    521518.gallery-columns-7 .gallery-item:nth-of-type(7n - 6),
    522519.gallery-columns-8 .gallery-item:nth-of-type(8n - 7),
    523520.gallery-columns-9 .gallery-item:nth-of-type(9n - 8) {
    524         margin-left: 2px; /* Compensate for the default negative margin on .gallery, which can't be changed. Images overflow the border in these cases. */
     521        margin-left: 12px; /* Compensate for the default negative margin on .gallery, which can't be changed. */
    525522}
    526523
    527524.gallery .gallery-caption {