Tagged: , ,

Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • September 18, 2014 at 3:07 pm #321224
    slui

    Hi,

    I’ve been fooling around with the CSS for a quite a while checking out the forums here and I was able to solve one of my problems in the product detail page, but not the shop catalog page.

    I’m looking to control the borders around each element of the images. In the website, you will see a border around the man, then a border around the product name and price and then one around the options. How can one control each of these borders or is that not possible?

    Thanks

    September 21, 2014 at 9:07 am #322596
    Dude

    Hi slui!

    1) Use this code to change the border color of the preview image container:

    
.main_color .thumbnail_container img, .main_color div.thumbnail_container{
border-color: #444;
}

    2) This code will change the style of the product name + price container:

    
#top .inner_product_header{
border-color: #444;
}

    3) This code will change the border of the buttons bellow the product name/price:

    
#top #wrap_all .avia_cart_buttons{
border-color: #444;
}

    Regards,
    Peter

    September 21, 2014 at 8:46 pm #322686
    slui

    Hi Dude,

    What you provided did not work. I took another closer look and it is under the class called “products”. If I change the border-color attribute, I’m able to remove all three borders in each area but that is not what I want. When I do this it also changes the hr color to a different color as well which is not what I want.

    I look forward to hearing from you.

    sl

    September 23, 2014 at 4:42 am #323459
    Ismael

    Hey!

    If you want to separately control the border of the product items, try this:

    .inner_product {
border: none;
}

.inner_product .thumbnail_container {
border: 1px solid red;
border-bottom: none;
}

#top .inner_product_header {
border: 1px solid blue;
border-bottom: none;
}

.avia_cart_buttons {
border: 1px solid orange !important;
border-top: none;
}

    Regards,
    Ismael

    September 24, 2014 at 7:50 pm #324582
    slui

    Hi Ismael,

    This worked perfectly. Thanks. You can close this off now.

    sl

  • Author
    Posts
Viewing 5 posts - 1 through 5 (of 5 total)
  • The topic ‘WooCommerce Shop Catalog Image Borders’ is closed to new replies.