[Skip to main content](#vessel-content)

#   Display fields overlap and error on checkout page

##

- **[jazzbird](/forum/user/33369-jazzbird "View jazzbird's Profile")**
- [![jazzbird's Avatar](https://www.hikashop.com/media/kunena/core/svg/person.svg)](/forum/user/33369-jazzbird "View jazzbird's Profile") Topic Author
- [ Offline](/forum/user/33369-jazzbird)

Less More

- Posts: 63
- Thank you received: 1
-
-

4 years 3 months ago [\#343696](#343696) by [jazzbird](/forum/user/33369-jazzbird "View jazzbird's Profile")  *[Display fields overlap and error on checkout page](/forum/27-checkout/904813-display-fields-overlap-and-error-on-checkout-page#343696 "-- url of the page with the problem -- :   www.catholicsforisrael.com/bible-course/shop/checkout  -- HikaShop version -- : 4.6.1 -- Joomla version -- : 3.10.10  I've got two problems with my Hikashop checkout page:  1) The fields overlap, resulting in a messy appearance.  It seems that the problem is due to the dynamic width of the checkout page. I have noticed that if I make the page narrower, the Login section appears above the Registration section, rather than side-by-side. How can I force the two sections to be displayed above each other rather than side-by-side, like this:  2) Trying to log in or register from the Hikashop checkout screen produces errors:  Grateful for any tips on how to solve those two issues!")* was created by *[jazzbird](/forum/user/33369-jazzbird "View jazzbird's Profile")*

-- url of the page with the problem -- : [ www.catholicsforisrael.com/bible-course/shop/checkout](https://www.catholicsforisrael.com/bible-course/shop/checkout)
-- HikaShop version -- : 4.6.1
-- Joomla version -- : 3.10.10

I've got two problems with my Hikashop checkout page:

1) The fields overlap, resulting in a messy appearance.

[ ![&#91;img  ](https://www.catholicsforisrael.com/tmp/Hikashop_Checkout_1.jpg) ](https://www.catholicsforisrael.com/tmp/Hikashop_Checkout_1.jpg "&#91;img  ")

It seems that the problem is due to the dynamic width of the checkout page. I have noticed that if I make the page narrower, the Login section appears above the Registration section, rather than side-by-side. How can I force the two sections to be displayed above each other rather than side-by-side, like this:

[ ![&#91;img  ](https://www.catholicsforisrael.com/tmp/Hikashop_Checkout_2.jpg) ](https://www.catholicsforisrael.com/tmp/Hikashop_Checkout_2.jpg "&#91;img  ")

2) Trying to log in or register from the Hikashop checkout screen produces errors:

[ ![&#91;img  ](https://www.catholicsforisrael.com/tmp/Hikashop_Checkout_3.jpg) ](https://www.catholicsforisrael.com/tmp/Hikashop_Checkout_3.jpg "&#91;img  ")

Grateful for any tips on how to solve those two issues!

Please [Log in](/login?return=aHR0cHM6Ly93d3cuaGlrYXNob3AuY29tL2ZvcnVtL2NoZWNrb3V0LzkwNDgxMy1kaXNwbGF5LWZpZWxkcy1vdmVybGFwLWFuZC1lcnJvci1vbi1jaGVja291dC1wYWdlP3RtcGw9bWFya2Rvd24=) or [Create an account](/component/users/registration?Itemid=101) to join the conversation.

- **[Philip](/forum/user/34318-philip "View Philip's Profile")**
- [![Philip's Avatar](https://www.hikashop.com/media/kunena/core/svg/person.svg)](/forum/user/34318-philip "View Philip's Profile")
- [ Offline](/forum/user/34318-philip)

Less More

- Posts: 4820
- Thank you received: 652
-
-

4 years 3 months ago -  4 years 3 months ago [\#343703](#343703) by [Philip](/forum/user/34318-philip "View Philip's Profile")  Replied by *[Philip](/forum/user/34318-philip "View Philip's Profile")* on topic *[Display fields overlap and error on checkout page](/forum/27-checkout/904813-display-fields-overlap-and-error-on-checkout-page#343703 "-- url of the page with the problem -- :   www.catholicsforisrael.com/bible-course/shop/checkout  -- HikaShop version -- : 4.6.1 -- Joomla version -- : 3.10.10  I've got two problems with my Hikashop checkout page:  1) The fields overlap, resulting in a messy appearance.  It seems that the problem is due to the dynamic width of the checkout page. I have noticed that if I make the page narrower, the Login section appears above the Registration section, rather than side-by-side. How can I force the two sections to be displayed above each other rather than side-by-side, like this:  2) Trying to log in or register from the Hikashop checkout screen produces errors:  Grateful for any tips on how to solve those two issues!")*

Hello,

"***1) The fields overlap, resulting in a messy appearance.***"
You can add this kind of css commands in your frontend file css, see how **[ here](https://www.hikashop.com/support/documentation/272-hikashop-display-by-color.html#custom)**.
Code:

\#checkout_ID_html_class .login_class_part, #checkout_ID_html_class .registration_class_part { width: 100%; }

"***2) Trying to log in or register from the Hikashop checkout screen produces errors:***"

In order to help us, **2** things you can do :
**1.** Process a test with a **default template** like protoStar, and make us your returns, even if that change nothing
**2.** Active the **Joomla debug** (maximum level) process a new test, and provide the screenshot with all new displayed data around your error.

Awaiting your elements for your second point.
Regards

Last edit: 4 years 3 months ago by [Philip](/forum/user/34318-philip "View Philip's Profile").

Please [Log in](/login?return=aHR0cHM6Ly93d3cuaGlrYXNob3AuY29tL2ZvcnVtL2NoZWNrb3V0LzkwNDgxMy1kaXNwbGF5LWZpZWxkcy1vdmVybGFwLWFuZC1lcnJvci1vbi1jaGVja291dC1wYWdlP3RtcGw9bWFya2Rvd24=) or [Create an account](/component/users/registration?Itemid=101) to join the conversation.

- **[jazzbird](/forum/user/33369-jazzbird "View jazzbird's Profile")**
- [![jazzbird's Avatar](https://www.hikashop.com/media/kunena/core/svg/person.svg)](/forum/user/33369-jazzbird "View jazzbird's Profile") Topic Author
- [ Offline](/forum/user/33369-jazzbird)

Less More

- Posts: 63
- Thank you received: 1
-
-

4 years 3 months ago [\#343718](#343718) by [jazzbird](/forum/user/33369-jazzbird "View jazzbird's Profile")  Replied by *[jazzbird](/forum/user/33369-jazzbird "View jazzbird's Profile")* on topic *[Display fields overlap and error on checkout page](/forum/27-checkout/904813-display-fields-overlap-and-error-on-checkout-page#343718 "-- url of the page with the problem -- :   www.catholicsforisrael.com/bible-course/shop/checkout  -- HikaShop version -- : 4.6.1 -- Joomla version -- : 3.10.10  I've got two problems with my Hikashop checkout page:  1) The fields overlap, resulting in a messy appearance.  It seems that the problem is due to the dynamic width of the checkout page. I have noticed that if I make the page narrower, the Login section appears above the Registration section, rather than side-by-side. How can I force the two sections to be displayed above each other rather than side-by-side, like this:  2) Trying to log in or register from the Hikashop checkout screen produces errors:  Grateful for any tips on how to solve those two issues!")*

Thanks for your quick reply, Philip. Some issues on the two points:

1) I followed the instructions on the first point, but I'm unable to save the frontend_custom.css file. I get an "internal server error". Is this the file you meant? Not the style_custom.css file? That one saves fine.

2) As for your second point, I'm not sure I understand. What do you mean by "process a test" and "make us your returns"? Switch to a default template and make a test Hikashop purchase?

Thanks for any continued help!

Please [Log in](/login?return=aHR0cHM6Ly93d3cuaGlrYXNob3AuY29tL2ZvcnVtL2NoZWNrb3V0LzkwNDgxMy1kaXNwbGF5LWZpZWxkcy1vdmVybGFwLWFuZC1lcnJvci1vbi1jaGVja291dC1wYWdlP3RtcGw9bWFya2Rvd24=) or [Create an account](/component/users/registration?Itemid=101) to join the conversation.

- **[nicolas](/forum/user/63-nicolas "View nicolas's Profile")**
- [![nicolas's Avatar](https://www.hikashop.com/media/kunena/avatars/resized/size144/users/avatar63.png?1793428657)](/forum/user/63-nicolas "View nicolas's Profile")
- [ Offline](/forum/user/63-nicolas)

Less More

- Posts: 86541
- Thank you received: 14304
-
-

4 years 3 months ago [\#343722](#343722) by [nicolas](/forum/user/63-nicolas "View nicolas's Profile")  Replied by *[nicolas](/forum/user/63-nicolas "View nicolas's Profile")* on topic *[Display fields overlap and error on checkout page](/forum/27-checkout/904813-display-fields-overlap-and-error-on-checkout-page#343722 "-- url of the page with the problem -- :   www.catholicsforisrael.com/bible-course/shop/checkout  -- HikaShop version -- : 4.6.1 -- Joomla version -- : 3.10.10  I've got two problems with my Hikashop checkout page:  1) The fields overlap, resulting in a messy appearance.  It seems that the problem is due to the dynamic width of the checkout page. I have noticed that if I make the page narrower, the Login section appears above the Registration section, rather than side-by-side. How can I force the two sections to be displayed above each other rather than side-by-side, like this:  2) Trying to log in or register from the Hikashop checkout screen produces errors:  Grateful for any tips on how to solve those two issues!")*

Hi,

1. You can add it to style_custom.css file either one is fine.

2. Activate the "debug" setting of the Joomla configuration page and reproduce the issue with that "getType" error. It will display the error message with more information on where the problem comes from.
Please provide all the information of the error so that we can understand what's going on and tell you what to do.

Please [Log in](/login?return=aHR0cHM6Ly93d3cuaGlrYXNob3AuY29tL2ZvcnVtL2NoZWNrb3V0LzkwNDgxMy1kaXNwbGF5LWZpZWxkcy1vdmVybGFwLWFuZC1lcnJvci1vbi1jaGVja291dC1wYWdlP3RtcGw9bWFya2Rvd24=) or [Create an account](/component/users/registration?Itemid=101) to join the conversation.

- **[jazzbird](/forum/user/33369-jazzbird "View jazzbird's Profile")**
- [![jazzbird's Avatar](https://www.hikashop.com/media/kunena/core/svg/person.svg)](/forum/user/33369-jazzbird "View jazzbird's Profile") Topic Author
- [ Offline](/forum/user/33369-jazzbird)

Less More

- Posts: 63
- Thank you received: 1
-
-

4 years 3 months ago [\#343734](#343734) by [jazzbird](/forum/user/33369-jazzbird "View jazzbird's Profile")  Replied by *[jazzbird](/forum/user/33369-jazzbird "View jazzbird's Profile")* on topic *[Display fields overlap and error on checkout page](/forum/27-checkout/904813-display-fields-overlap-and-error-on-checkout-page#343734 "-- url of the page with the problem -- :   www.catholicsforisrael.com/bible-course/shop/checkout  -- HikaShop version -- : 4.6.1 -- Joomla version -- : 3.10.10  I've got two problems with my Hikashop checkout page:  1) The fields overlap, resulting in a messy appearance.  It seems that the problem is due to the dynamic width of the checkout page. I have noticed that if I make the page narrower, the Login section appears above the Registration section, rather than side-by-side. How can I force the two sections to be displayed above each other rather than side-by-side, like this:  2) Trying to log in or register from the Hikashop checkout screen produces errors:  Grateful for any tips on how to solve those two issues!")*

Hi Nicolas,

Thanks for the continued help. Update:

1) Code:

\#checkout_ID_html_class .login_class_part, #checkout_ID_html_class .registration_class_part { width: 100%; }

I inserted the code Philippe suggested into the file style_custom.css but it didn't do anything. The fields continue to overlap as illustrated on the first screenshot above. As mentioned, I'm unable to modify or save the frontend_custom.css file. I get an "internal server error".

2) Regarding the error message on the checkout screen, I did turn on the debugging and was able to identify an extension that conflicted with Hikashop. I disabled the extension and it seems like the error is gone. So I think this is resolved. I will update if the problem returns.

Thanks again,

Andre

Please [Log in](/login?return=aHR0cHM6Ly93d3cuaGlrYXNob3AuY29tL2ZvcnVtL2NoZWNrb3V0LzkwNDgxMy1kaXNwbGF5LWZpZWxkcy1vdmVybGFwLWFuZC1lcnJvci1vbi1jaGVja291dC1wYWdlP3RtcGw9bWFya2Rvd24=) or [Create an account](/component/users/registration?Itemid=101) to join the conversation.

- **[nicolas](/forum/user/63-nicolas "View nicolas's Profile")**
- [![nicolas's Avatar](https://www.hikashop.com/media/kunena/avatars/resized/size144/users/avatar63.png?1793428657)](/forum/user/63-nicolas "View nicolas's Profile")
- [ Offline](/forum/user/63-nicolas)

Less More

- Posts: 86541
- Thank you received: 14304
-
-

4 years 3 months ago [\#343741](#343741) by [nicolas](/forum/user/63-nicolas "View nicolas's Profile")  Replied by *[nicolas](/forum/user/63-nicolas "View nicolas's Profile")* on topic *[Display fields overlap and error on checkout page](/forum/27-checkout/904813-display-fields-overlap-and-error-on-checkout-page#343741 "-- url of the page with the problem -- :   www.catholicsforisrael.com/bible-course/shop/checkout  -- HikaShop version -- : 4.6.1 -- Joomla version -- : 3.10.10  I've got two problems with my Hikashop checkout page:  1) The fields overlap, resulting in a messy appearance.  It seems that the problem is due to the dynamic width of the checkout page. I have noticed that if I make the page narrower, the Login section appears above the Registration section, rather than side-by-side. How can I force the two sections to be displayed above each other rather than side-by-side, like this:  2) Trying to log in or register from the Hikashop checkout screen produces errors:  Grateful for any tips on how to solve those two issues!")*

Hi,

You need to adapt the CSS. Philippe only provided an example but really the checkout_ID_html_class and login_class_part and registration_class_part need to be replaced with the corresponding ID and classes by looking at the HTML elements with the inspector of your browser.
You can't just copy/paste the code "as is".

So I looked into it in your stead and the CSS code should be in your case: Code:

.hikashop_checkout_login .hkc-lg-4, .hikashop_checkout_login .hkc-lg-8{ width: 100%; }

The following user(s) said Thank You: [jazzbird](/forum/user/33369-jazzbird "View jazzbird's Profile")

Please [Log in](/login?return=aHR0cHM6Ly93d3cuaGlrYXNob3AuY29tL2ZvcnVtL2NoZWNrb3V0LzkwNDgxMy1kaXNwbGF5LWZpZWxkcy1vdmVybGFwLWFuZC1lcnJvci1vbi1jaGVja291dC1wYWdlP3RtcGw9bWFya2Rvd24=) or [Create an account](/component/users/registration?Itemid=101) to join the conversation.

- **[jazzbird](/forum/user/33369-jazzbird "View jazzbird's Profile")**
- [![jazzbird's Avatar](https://www.hikashop.com/media/kunena/core/svg/person.svg)](/forum/user/33369-jazzbird "View jazzbird's Profile") Topic Author
- [ Offline](/forum/user/33369-jazzbird)

Less More

- Posts: 63
- Thank you received: 1
-
-

4 years 3 months ago [\#343743](#343743) by [jazzbird](/forum/user/33369-jazzbird "View jazzbird's Profile")  Replied by *[jazzbird](/forum/user/33369-jazzbird "View jazzbird's Profile")* on topic *[Display fields overlap and error on checkout page](/forum/27-checkout/904813-display-fields-overlap-and-error-on-checkout-page#343743 "-- url of the page with the problem -- :   www.catholicsforisrael.com/bible-course/shop/checkout  -- HikaShop version -- : 4.6.1 -- Joomla version -- : 3.10.10  I've got two problems with my Hikashop checkout page:  1) The fields overlap, resulting in a messy appearance.  It seems that the problem is due to the dynamic width of the checkout page. I have noticed that if I make the page narrower, the Login section appears above the Registration section, rather than side-by-side. How can I force the two sections to be displayed above each other rather than side-by-side, like this:  2) Trying to log in or register from the Hikashop checkout screen produces errors:  Grateful for any tips on how to solve those two issues!")*

It looks like that code worked. Thanks very much!

Please [Log in](/login?return=aHR0cHM6Ly93d3cuaGlrYXNob3AuY29tL2ZvcnVtL2NoZWNrb3V0LzkwNDgxMy1kaXNwbGF5LWZpZWxkcy1vdmVybGFwLWFuZC1lcnJvci1vbi1jaGVja291dC1wYWdlP3RtcGw9bWFya2Rvd24=) or [Create an account](/component/users/registration?Itemid=101) to join the conversation.

Board Categories HikaShop Install &amp; Update Product &amp; Category Display Content Creation Sales and Orders Orders management Reports &amp; Statistics Customers Checkout Payment Methods Shipping Methods Import &amp; Export (CSV, XLS…) Specific Features Affilation Taxes Wishlist Vote Carousel &amp; Slider Mass Actions Filters &amp; Search Discount &amp; Coupon Feature Request Integrations Showcase General Talk about HikaShop Development HikaShop 3.0 Beta Translation Commercial Jobs HikaShop Components HikaMarket Market: Feature requests Market: How to? Market: Bug Report HikaSerial General talk about HikaSerial Serial: Bug Report Serial: How to? Support en Français de HikaSerial (French Support) HikaSubscription HikaAuction Auction: Feature requests Auction: How to? Auction: Bug report Hikashop around the world Support en Français (French Support) Russian FAQ. Курс выживания с Hikashop. Частые вопросы и о Расширения Hikashop Наши сайты на Hikashop 日本語版サポート(Japanese Support) Thai German Archives Bug Report How to?

[](/forum/topics/feed/mode-topics?format=feed&type=rss)

Time to create page: 0.068 seconds

[Powered by](/forum/credits) [Kunena Forum](https://www.kunena.org)
