editCreditCard.css (1170B)
1 /* This Source Code Form is subject to the terms of the Mozilla Public 2 * License, v. 2.0. If a copy of the MPL was not distributed with this 3 * file, You can obtain one at http://mozilla.org/MPL/2.0/. */ 4 5 .editCreditCardForm { 6 display: grid; 7 grid-template-areas: 8 "cc-number cc-exp-month cc-exp-year" 9 "cc-name cc-csc ." 10 "billingAddressGUID billingAddressGUID billingAddressGUID"; 11 grid-template-columns: 4fr 2fr 2fr; 12 grid-row-gap: var(--grid-column-row-gap); 13 grid-column-gap: var(--grid-column-row-gap); 14 } 15 16 .editCreditCardForm label { 17 /* Remove the margin on these labels since they are styled on top of 18 the input/select element. */ 19 margin-inline-start: 0; 20 margin-inline-end: 0; 21 } 22 23 .editCreditCardForm .container { 24 display: flex; 25 } 26 27 #cc-number-container { 28 grid-area: cc-number; 29 } 30 31 #cc-exp-month-container { 32 grid-area: cc-exp-month; 33 } 34 35 #cc-exp-year-container { 36 grid-area: cc-exp-year; 37 } 38 39 #cc-name-container { 40 grid-area: cc-name; 41 } 42 43 #cc-csc-container { 44 grid-area: cc-csc; 45 } 46 47 #billingAddressGUID-container { 48 grid-area: billingAddressGUID; 49 } 50 51 #billingAddressGUID { 52 grid-area: dropdown; 53 }