‘Postcode’ label verspringt met multi step checkout

  • Hallo,

    Ten eerste: mooie plugin! Was zeer onder de indruk van wat hij allemaal doet en hoe goed hij werkt.

    Eén ding waar ik tegenaan liep: ik gebruik een multi step checkout en het ‘Postcode’ label werkt niet netjes mee op elke resolutie. Zodra er ruimte is naast ‘Nr’ en ‘Toev’ gaat ‘ie liever daar staan dan dat ‘ie braaf boven z’n eigen veld blijft hangen. Zie https://prnt.sc/g6ztbw ipv https://prnt.sc/g6ztld.

    Wellicht hebben jullie hier een simpele oplossing voor?

    Mvg,

    Mark

Viewing 3 replies - 1 through 3 (of 3 total)
  • Ewout

    (@pomegranate)

    Hallo Mark,
    Dank voor de complimenten!

    Je zou het kunnen proberen met de volgende CSS:

    
.woocommerce-page form .form-row-quart-first,
.woocommerce form .form-row-quart-first {
	margin-right: 4% !important;
}

    Mogelijk moet je even met die 4% spelen om het goed te krijgen.

    Ewout

    Thread Starter digitaalinvorm

    (@digitaalinvorm)

    Hoi Ewout,

    Bedankt voor het snelle antwoord!

    Die oplossing werkt goed bij hogere resoluties, alleen bij lagere resoluties heb ik nog steeds hetzelfde probleem – zodra er ruimte is op de vorige regel springt ‘Postcode’ liever daar naartoe. Zie: https://prnt.sc/g7c6jq.

    Ik heb nog wat meer zitten klooien met de velden (https://prntscr.com/g7cci3) maar het probleem blijft hetzelfde. Op sommige resoluties is hij netjes maar zodra er ruimte is verspringt hij.

    Enige wat ik uiteindelijk kon bedenken was alle form-row-quart weghalen: https://prnt.sc/g7ceaa. Niet echt mooi maar het werkt. Heb jij nog een beter idee?

    Zo niet, kun je even kijken of ik nog iets fout doe met deze code?

    // WooCommerce change field size
add_filter( 'woocommerce_checkout_fields' , 'custom_rename_wc_checkout_fields' );

// Change size
function custom_rename_wc_checkout_fields( $fields ) {
  $fields['billing']['billing_street_name']['class'] = apply_filters( 'nl_custom_address_field_class', array( 'form-row-wide' ), $form, 'street_name' );
  $fields['billing']['billing_house_number']['class'] = apply_filters( 'nl_custom_address_field_class', array( 'form-row-first' ), $form, 'house_number' );
  $fields['billing']['billing_house_number_suffix']['class'] = apply_filters( 'nl_custom_address_field_class', array( 'form-row-last' ), $form, 'house_number_suffix' );
  $fields['billing']['billing_postcode']['class'] = apply_filters( 'nl_custom_address_field_class', array( 'form-row-first' ), $form, 'postcode' );
  $fields['billing']['billing_city']['class'] = apply_filters( 'nl_custom_address_field_class', array( 'form-row-last' ), $form, 'city' );
return $fields;
}

    Bedankt!

    Mark

    Thread Starter digitaalinvorm

    (@digitaalinvorm)

    Haha, grapje: https://prnt.sc/g7lulg

    Oplossing van mij was dus iets te simpel.

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘‘Postcode’ label verspringt met multi step checkout’ is closed to new replies.