Unusual Border

  • Resolved hodgespodges

    (@hodgespodges)


    9 years, 4 months ago

    Hi guys,

    I’ve made a catalogue on this page – https://www.pledgenotes.com/buyers-board/ using the following Custom CSS (see below).
    I wanted to reduce the height of the individual boxes as there is very little content for each product and no image is necessary. I managed to do this but there is a faint grey line going down the left hand side of the products (in between each product) that I would like to get rid of.
    Interestingly, this line appearing between products disappears on mobile.

    Custom CSS:
    .grey-prod-cat-header-div {display: none !important;}
    .upcp-detail-item {
    min-height: 60px;
    max-height: 100px;
    }
    .upcp-mid-detail-div {
    width: 100%;
    border-right: none;
    }
    .upcp-detail-image-div {
    display: none;
    }
    .upcp-end-detail-div {
    display: none;
    }
    .prod-cat-sidebar-cat-title {
    margin-bottom: -20px;
    }
    .prod-cat-sidebar-cat-title {
    margin-top: 10px;
    }
    .prod-cat-header-div {
    display: none;
    }
    .prod-cat-category:first-of-type {
    margin-top: -30px;
    }

    Can you please look into a solution to get rid of that line?

    Many thanks,

    Simon

Viewing 2 replies - 1 through 2 (of 2 total)
  • etoilewebdesign

    (@etoilewebdesign)

    9 years, 4 months ago

    Hi Simon,

    To get rid of that left border, just add border-left:none; to .upcp-mid-detail-div in your custom CSS.

    So you’ll be changing this: 

    
.upcp-mid-detail-div {
width: 100%;
border-right: none;
}

    To this:

    
.upcp-mid-detail-div {
width: 100%;
border-right: none;
border-left: none;
}
    Thread Starter hodgespodges

    (@hodgespodges)

    9 years, 4 months ago

    Fantastic, thank you very much indeed!

Viewing 2 replies - 1 through 2 (of 2 total)

The topic ‘Unusual Border’ is closed to new replies.