Image Border

Hi guys, How can I create a nice image border using CSS on the images placed in the articles in this template?

Hi,

In general you should use code similar to this:

Code: Select all

#gkMainbody article p img {
border: 1px solid #e5e5e5;
display: inline-block;
padding: 3px;
}


Thanks for this!
Which is the best file to include this code in?

The best will be the css/joomla.css file at the end.

I've done this, but as you can see, nothing has changed: www.creative-designs.co.za/tala
Is there something else I can try? or add the code into a different file perhaps?

I've created a code for images in the article - you need as I see also the same border for the images in the custom HTML module - please replace the selector:

Code: Select all

#gkMainbody article p img {

for:

Code: Select all

.custom p img,
#gkMainbody article p img {

Hi, I have tried this and it's still not working.
I am going to PM you the access details.. Maybe I am doing something wrong

Sorry I cannot connect via FTP but the following code added in the joomla.css file:

Code: Select all

.custom p img,
#gkMainbody article p img {
border: 1px solid #e5e5e5;
display: inline-block;
padding: 3px;
}


must works, because I've added it in the Chrome Dev Tools and the borders appeared around the images.

If the IP address is not working for the FTP, try using creative-designs.co.za
Sometimes we have problems with the IP address.. but i've checked my connection, and I am able to connect with creative-designs.co.za

I've moved the code fragment to the template.css file and now it works fine.

YAYAYAY!!! You are amazing! It looks great!
Thank you so so so much!!!
)

Hi Dziudek,

Remember you assisted me with adding the border to my images?
For some reason the border isn't added to the images within the website. It only shows the border on the images on the homepage (they are within modules)..
See this page as an example http://www.creative-designs.co.za/tala/ ... -mphahlele

Is there another line of code I need to add somewhere to put borders around every other image too?

Hi

Try add this code to override.css file:

Code: Select all

#gkMainbody .articleContent p img {
    border: 1px solid #E5E5E5;
    display: inline-block;
    padding: 3px;
}


Remember to have using of override enabled in template settings.

Thank you so much!!

Hi

No problem. Glad I could help.