/* This Source Code Form is subject to the terms of the Mozilla Public * License, v. 2.0. If a copy of the MPL was not distributed with this * file, You can obtain one at http://mozilla.org/MPL/2.0/. */ .editAddressForm { display: flex; flex-wrap: wrap; /* Use space-between so --grid-column-row-gap is in between the elements on a row */ justify-content: space-between; } dialog:not([subdialog]) .editAddressForm { margin-inline: calc(var(--grid-column-row-gap) / -2); } .editAddressForm .container { /* !important is needed to override preferences.css's generic label rule. */ margin-top: var(--grid-column-row-gap) !important; margin-inline: calc(var(--grid-column-row-gap) / 2); flex-grow: 1; } #country-container { /* The country dropdown has a different intrinsic (content) width than the other fields which are . */ flex-basis: calc(50% - var(--grid-column-row-gap)); flex-grow: 0; /* Country names can be longer than 50% which ruins the symmetry in the grid. */ max-width: calc(50% - var(--grid-column-row-gap)); } #name-container, #street-address-container { /* Name and street address are always full-width */ flex: 0 1 100%; } #street-address { resize: vertical; } #country-warning-message { box-sizing: border-box; font-size: 1rem; display: flex; align-items: center; text-align: start; opacity: .5; padding-inline-start: 1em; flex: 1; } dialog:not([subdialog]) #country-warning-message { display: none; } moz-button-group{ margin-inline: 4px; margin-block-end: 4px; }