How can I add border frame on the image? :)

[jyc109th]

Hello, I really thank you for your help.

please, see my picture I attached.

I want to add border frame 1px on my image like other page..

I tried to change to some code in css, but it was hard..

thank you!

Attachments:

You must be logged in to view attached files.

[jyc109th]

Hello I solved that case, but I have another one..

please, see my attached file, and I’m using this css file.

.product div.images #product-img-slider {
border: 1px solid #e4e4e4;
width: 98%;
}

However, New image and product image are not matched each other..

is there a solution that is about this problem..

thank you!

Attachments:

You must be logged in to view attached files.

[Mohammad – SUPPORT]

Hi,
I am not getting your issue exactly. Please mark the screenshot image to explain your issue better.
Thanks
Mohammad

[jyc109th]

Hi, Mohammad

Thank you for your reply, and I attached my picture..
– Site address: http://tctest.cafe24.com/?product=xth
– Inserted Css: .product div.images #product-img-slider {
border: 1px solid #e4e4e4;
width: 98%;
}

Here is my problem, When I use Chrome browser image border is o.k, but
when I use IE11 I can’t see image border not at all. it’s so strange..

Also, I have to use ‘width 98% css code’ because when I remove that code, I can’t see image border even though I use chrome..

I really need your help.. I need to add image border on the product image..

I always thank you, and this is really good theme.. 🙂

Attachments:

You must be logged in to view attached files.

[Mohammad – SUPPORT]

Hi,
Please use this custom css code:-

.product div.images #product-img-slider {
border: 1px solid #e4e4e4;
width: 97% !important;
}

Thanks
Mohammad

[jyc109th]

Hello, Mohanmmad.

This is David, Cho.

hm.. I inserted css code you gave me, but It didn’t work.

width: 97% !important; -> IE11 O.k, but Chrome is not O.K (border is missing)
width: 98% !important; -> IE11 is not O.K(border is missing), but Chrome is O.K

I don’t know why.. I need your help one more.. I feel like..

thank you.

[Mohammad – SUPPORT]

Hi,
Please remove last code and insert this one new code:-

 #product-img-slider {
border: 1px solid #e4e4e4 !important;
width: 100% !important;
}

Thanks
Mohammad

[jyc109th]

Hello, Mohammad

This is David, Cho.
I inserted this code, but I can’t see right border on the image by using both browser.
IE11 and Chrome doesn’t show right border.. when I use width 100% code.

#product-img-slider {
border: 1px solid #e4e4e4 !important;
width: 100% !important;
}

[Kyle – SUPPORT]

Hi

Change it to:

.product .images {
  border: 1px solid #e4e4e4 !important;
}

– Kyle

[Mohammad – SUPPORT]

Hi,
Please remove last code and use this new one code:-

.woocommerce div.product div.images{
border:1px solid #e4e4e4 !important;
}

Thanks
Mohammad

[jyc109th]

Hello Mohammed, Kyle

Thank you for your reply and kindness.

I inserted this code into css file..

.woocommerce div.product div.images{
border:1px solid #e4e4e4 !important;
}

but, please see attached picture, I want to remove some line I marked.

and I can’t see right line yet..

there is no good way?

please help!

http://tctest.cafe24.com/?product=xth

Attachments:

You must be logged in to view attached files.

[Kyle – SUPPORT]

Ok try removing all previous css and add this:

#product-img-slider {
  border: 1px solid #e4e4e4;
  width: 99.8%;
}

– Kyle

[Mohammad – SUPPORT]

Hi,
Please use this new custom css code:-

.flex-viewport{
border:1px solid #e4e4e4 !important;
}

Thanks
Mohammad

[jyc109th]

Hello, Kyle

Thank you for your reply. The css code you taught me was useful, but I couldn’t see image border right side sometimes.

when the size of window is small, I can’t see any right border on the image. However, when I get full size window, I can see right border on the image..

I feel like we still have same problem yet..

I really hope solve this problem, because our products have white background image. So, if I use just normal css code, it’s hard to recognize for our customers the image on the website.

So.. I really need your help, Kyle.. 🙂

I always thank you, have a nice day..

Attachments:

You must be logged in to view attached files.

[Kyle – SUPPORT]

We’ve done the best we could, if it’s not working, then I’m afraid you’ll have to leave the border off. There’s nothing else for us to try

– Kyle