4.x customer login/register screen out of alignment

Quote

Post by sean74 » Thu Jun 05, 2025 2:28 pm

i just notice the login/register screen was not mobile responsive correctly.
i had added the bootstrap col sizing, so that, the register and login box align properly in mobile device.
apparently the column class "col mb3" will not reflect in mobile, changed to "col-12 col-md-6 mb-3"
file : catalog/template/account/login.twig

Code: Select all

-- original code --
    <div id="content" class="col">
      {{ content_top }}
      <div class="row">
              <div class="col mb-3"> <!-- bug here -->
		<!-- code -->
        </div>
        <div class="col mb-3"> <!-- bug here -->
		<!-- code -->
        </div>

-- fixed
    <div id="content" class="col">
      {{ content_top }}
      <div class="row">
        <div class="col-12 col-md-6 mb-3">  <!-- fixed here -->
		<!-- code -->
        </div>
        <div class="col-12 col-md-6 mb-3">  <!-- fixed here -->
		<!-- code -->
        </div>
hope this help and always great to share.
happy programming
sean74
Newbie
Posts
1
Joined
Thu Jun 05, 2025 2:15 pm
Top

Re: 4.x customer login/register screen out of alignment

Quote

Post by cartcraft » Wed Aug 27, 2025 3:28 am

Hello, I hope you are well.
Have you tried this method?

Code: Select all

<div id="content" class="col">
      {{ content_top }}
      <div class="row">
        <div class="col-sm-6 col-lx-6 col-ms-6 col-md-6 col-lg-6">  <!-- fixed here -->
		<!-- code -->
        </div>
        <div class="col-sm-6 col-lx-6 col-md-6 col-md-6 col-lg-6">  <!-- fixed here -->
		<!-- code -->
        </div>
Thanks
Masud
cartcraft
Newbie
Posts
1
Joined
Sun Dec 08, 2024 1:24 am
Top
Post Reply
Return to “Feedback”
Who is online

Users browsing this forum: No registered users and 6 guests