Home › Forums › WoodMart support forum › Lower border or Separator blow products on the shop page

Lower border or Separator blow products on the shop page

Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
    Posts
  • December 7, 2020 at 5:08 pm #248611

    imbacactus
    Participant

    Hello, I would like to display a separator or only the lower border under each product on the shop page. I attached two pictures of 1. what i would like to achieve and 2. of what i get if i enable the bordered view. Is there some setting in the theme that can include separators or lower borders with spaces? Thank you for your time.

    Attachments:
    You must be logged in to view attached files.
    December 7, 2020 at 5:34 pm #248621

    Nafiul35
    Participant

    Hello! imbacactus!

    Add this CSS code to your website. I think this will help you.

    .products-bordered-grid.elements-grid {
    border-left-width: 0px !important;
}

.products-bordered-grid.elements-grid:not(.elements-list) .product-grid-item {
    border-right-width: 0px !important;
    margin: 0 10px !important;
    border-top: 0px !important;
}

    Thanks,
    Nafiul

    December 8, 2020 at 6:34 am #248775

    Aizaz Imtiaz Awan
    Keymaster

    Hello,


    @Nafiul35     Thank you for your involvement.


    @imbacactus     Please try using the code provided above if it doesn’t work then disable the maintenance mode and tell me to check it myself and help you out accordingly.

    Regards.
    Xtemos Studios.

    December 8, 2020 at 8:51 am #248813

    imbacactus
    Participant

    Thank you for your help @nafiul35. The code is correcting the border as specified but it disables one column on desktop & on mobile. What I mean by that is that I have set 3 columns but now only two are disabled on desktop and instead of 2 on mobile 1 is displayed. See screenshot https://i.imgur.com/7Oqk7Ky.png

    @Aizaz Imtiaz Awan could you please help me to correct that? I disabled the maintenance mode and attached the login info on the private content.

    December 8, 2020 at 10:34 am #248837

    Aizaz Imtiaz Awan
    Keymaster

    Hello,

    The Issue is caused by the margin value that is set to 10px please remove the previous Custom CSS in the Global Custom CSS area.

    .products-bordered-grid.elements-grid {
	border-left-width: 0px !important;
}

.products-bordered-grid.elements-grid:not(.elements-list) .product-grid-item {
	border-right-width: 0px !important;
	border-top: 0px !important;
}

    The CSS will not add space between the borders. It is not possible to add space between the borders of the grid when you do it the columns will be disturbed. You can keep this CSS if you want the result otherwise it requires customizations and it is beyond our limitations and support policy.

    Best Regards.

    December 8, 2020 at 4:22 pm #248946

    imbacactus
    Participant

    Thank you very much both for your help, it looks great like this

    December 9, 2020 at 6:35 am #249075

    Aizaz Imtiaz Awan
    Keymaster

    Most Welcome!!!.

    I’m so happy to hear you are pleased with the Theme and Support. XTEMOS strives to deliver the best customer experience, and it makes our day to hear we have accomplished that.

    We count ourselves lucky to have you as a customer. You can always reach us at any time. We are always here to help you.

    Thanks for contacting us.
    Have a great day.

    Topic Closed.
    Best Regards.

  • Author
    Posts
Viewing 7 posts - 1 through 7 (of 7 total)

The topic ‘Lower border or Separator blow products on the shop page’ is closed to new replies.