Layout issue on account registration

  • Posts: 2
  • Thank you received: 0
8 years 1 month ago #252440

During the checkout process, customers need to register. At the Login or create a new account page there is a layout issue I am unable to solve. As you can see on either the website or attached screenshot, the * for mandatory fields in the registration part is displayed at the wrong position. If you look at the Address Information part below this, the * is displayed at the correct position.

If I look at the html, I see that the lower correct part has this:
<span class="hikashop_field_required">*</span>
And the top part only this
*

Attachments:

Please Log in or Create an account to join the conversation.

  • Posts: 4748
  • Thank you received: 644
  • MODERATOR
8 years 1 month ago #252444

Hello,

In order to correct this kind of display issue, you can edit the frontend.css in order to custom it.
See this, here to learn how to create a frontend_custom.css.

Maybe a this kind of css code can solve your display issue :

span.hikashop_field_required {
   margin-bottom: Xpx
}

Hope this will help you.

Regards

Last edit: 8 years 1 month ago by Philip.

Please Log in or Create an account to join the conversation.

  • Posts: 2
  • Thank you received: 0
8 years 1 month ago #252693

Hi Philip,

Thanks for the advice. However, this has only effect on the part that is already working correctly.(the custom hikashop fields like city, adress, ... The part that is displayed wrong is the top part with username, email, password.

Kind regards,
Erik

Please Log in or Create an account to join the conversation.

  • Posts: 4748
  • Thank you received: 644
  • MODERATOR
8 years 1 month ago #252745

Hello,

So why use a more precise selector like in this example :

<div class="Grand-parent">
    <div class="parent1">
        <input class="address">
        <input class="address_city">
        <input class="country">
    </div>
    <div class="parent2">
         <input class="name">
        <input class="mail">
        <input class="password">
    </div>
</div>

In this kind of situation, your selector can be write like this :
div.Grand-parent div.parent2 input {
    CSS COMMAND: VALUE
}

This kind of way to create your selector able you to add a Css command ONLY on input displaying in div.parent2.

Hope this will help you

Regards

Last edit: 8 years 1 month ago by Philip.

Please Log in or Create an account to join the conversation.

Time to create page: 0.064 seconds
Powered by Kunena Forum