Joomla Templates Club 406,261 posts

[nikol Friend nikolJoin date: July 2009Posts: 12Downloads:27Uploads:0 Thanks: 3 Thanked: 1 times in 1 posts]

#176173

i have 800 articles with text and 1 image on the left hand. sofar used JA Kyonite II 1.5, there is no 2.5 version of this.
transferred all files with j2xml to JA Portfolio 2.5, am nearly ready but do not like the lack of spacing between image and text
see that similar questions were placed for a few ‘old’ 1.5 template in 2007,8 and 9.
it is nearly impossible to change the spacing for each article individually
is there a solution to add spacing in the css file for the new 2.5 template?

[John Wesley Brett Moderator John Wesley BrettJoin date: July 2013Posts: 2142Downloads:17Uploads:26 Thanks: 175 Thanked: 645 times in 426 posts]

#448506

Please provide us with at least a URL so we may see what you need to do.

Thank you!
John.

[nikol Friend nikolJoin date: July 2009Posts: 12Downloads:27Uploads:0 Thanks: 3 Thanked: 1 times in 1 posts]

#448511

<em>@jwbrett 313964 wrote:</em><blockquote>Please provide us with at least a URL so we may see what you need to do.

Thank you!
John.</blockquote>

Thanks John
The URL is http://www.uniquesmallhotels.com .There you see between the image and the text sufficient space. My new website is made in WAMP on my laptop, therefore cannot show you now. The layout is identical, however the text is attached to the image.
Please use a browser other than Internet Explorer. IE gives me problems with JA Kyanite II and therefore want to change asap.
Henk

[John Wesley Brett Moderator John Wesley BrettJoin date: July 2013Posts: 2142Downloads:17Uploads:26 Thanks: 175 Thanked: 645 times in 426 posts]

#448530

Very simple solution.

Goto: /templates/ja_kyanite_ii/css/template.css – Line 303


.article-content img {
margin: 5px;

}

As you see you currently only have a 5px margin at top, bottom, left and right.

May I suggest you modify the code above to add the following line:

img {
margin: 5px;
padding: 0 5px 5px 0;

}

If you are not familiar with CSS, you would read that line as:
Add a PADDING of 0px at top, 5px to the right, 5px to the bottom, and 0px to the left
Think of it like a clock…and you go clockwise beginning at the top… so it is TOP, RIGHT, BOTTOM, LEFT.

Adjust the settings until you get the look you like.

Have fun!
John.

1 user says Thank You to John Wesley Brett for this useful post

1. nikol

[nikol Friend nikolJoin date: July 2009Posts: 12Downloads:27Uploads:0 Thanks: 3 Thanked: 1 times in 1 posts]

#448692

Maybe you misunderstood – I am moving from JA Kyanite II 1.5 to JA Portfolio 2.5.
I have added your suggested img code right under img-border (line 217-221) as a separate item.
During my trial and error, I changed the padding under img-border, changed it again just now, but there it does not work.
By creating a separate item (line:) 223-226), IT WORKS.

[Author]

Posts