Remove empty rows in payment methods table

  • Posts: 43
  • Thank you received: 1
6 years 1 month ago #91417

I've got empty rows in my payment methods table that I want to remove. I've turned on table borders so you can see what I mean in the screenshot. How can I get rid of these and close up the rows please so there's no space in between?

Attachments:

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

  • Posts: 65163
  • Thank you received: 9467
  • MODERATOR
6 years 1 month ago #91547

That's a CSS issue coming from your template CSS.
We would need to look directly at the page with firebug in order to analyze the CSS of your template in order to tell you exactly what to do. Could you give a link to a product page of your website so that we can access the checkout ?

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

  • Posts: 43
  • Thank you received: 1
6 years 1 month ago #91574

OK thanks, I will look at that. Website is not live yet. If it helps here is a screenshot of the Firebug screen for the table. It shows extra rows but I'm not sure where they come from.

Attachments:

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

  • Posts: 13201
  • Thank you received: 2316
  • MODERATOR
6 years 1 month ago #91677

You can maybe try the following css properties:

.hikashop_payment_methods_table tr{ display: none;}
.hikashop_payment_methods_table tr .row0, .hikashop_payment_methods_table tr .row1{ display:inherit !important;}

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

  • Posts: 43
  • Thank you received: 1
6 years 1 month ago #91679

Thanks for trying Xavier but that just results in no rows being displayed in the table.

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

  • Posts: 13201
  • Thank you received: 2316
  • MODERATOR
6 years 1 month ago #91751

And with that:

.hikashop_payment_methods_table tr{ display: none;}
.hikashop_payment_methods_table tr .row0, .hikashop_payment_methods_table tr .row1{ display:table-row !important;}

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

  • Posts: 43
  • Thank you received: 1
6 years 1 month ago #91792

No, but thanks for trying.

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

  • Posts: 13201
  • Thank you received: 2316
  • MODERATOR
6 years 1 month ago #91899

Can you give us a screenshot to your website ?

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

  • Posts: 10
  • Thank you received: 0
  • Hikashop Essential
2 months 2 weeks ago #302462

HikaShop Essential: 4.0.1

Hi. Is it possible to remove the column containing the payment option images (or narrow it individually, or move it after the text)?
It is very wide when viewed on mobiles, especially when no content in it.

Thanks
Greg

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

  • Posts: 65163
  • Thank you received: 9467
  • MODERATOR
2 months 2 weeks ago #302465

Hi,

You can use CSS to hide it or modify the way it displays.
www.hikashop.com/support/documentation/1...ize-the-display.html

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

  • Posts: 10
  • Thank you received: 0
  • Hikashop Essential
2 months 2 weeks ago #302519

Hi Nicolas

I am talking about the middle and right hand columns, as shown in the first image by the OP.
The middle column is the one I want to hide/remove.
I can't see how CSS can sort it out as this column has the same name as the right hand column, so modifying the one modifies the other.

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

  • Posts: 65163
  • Thank you received: 9467
  • MODERATOR
2 months 1 week ago #302548

Hi,

In recent versions of HikaShop and with the "checkout legacy" setting turned off (so you use the new checkout and not the old one from HikaShop 2.x), the area with the image has a class hikashop_checkout_payment_images so you can do something like that:

.hikashop_checkout_payment_images{
 display:none;
}
So it should be really easy in CSS.
Now I don't know how your website is configured and as you didn't give a link to the shop nor instructions to reproduce, I can't check the CSS/HTML there.

Note also that there is no problem having CSS affecting only the second column of a table, even without ids or classes. Here is an page about that:
stackoverflow.com/questions/2535112/usin...nd-column-of-a-table

The following user(s) said Thank You: TwoFatFingers

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

  • Posts: 10
  • Thank you received: 0
  • Hikashop Essential
2 months 1 week ago #302562

Hi Nicolas

Thank you, I did not know that about td cells and css!

I ended up adding the following to my template css , which works:

.hikashop_payment_methods table tr td{
display:inline-block;
}
.hikashop_payment_methods table tr td + td{
display:none;
}
.hikashop_payment_methods table tr td + td + td{
display:inline-block;
}

Thanks again!

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

Time to create page: 0.101 seconds
Powered by Kunena Forum