Space Between banners and remove border

Everything to do with Joomla! 1.5 templates and templating.

Moderator: General Support Moderators

Forum rules
Forum Rules
Absolute Beginner's Guide to Joomla! <-- please read before posting, this means YOU.
Locked
rileyjacob
Joomla! Apprentice
Joomla! Apprentice
Posts: 7
Joined: Mon Feb 11, 2008 6:45 pm

Space Between banners and remove border

Post by rileyjacob » Thu May 15, 2008 3:41 pm

I am using the banner component and when two or more banners show, they stack on top of each other with no space between them and they also have a blue border around them. How do I space these and what files do I need to edit. I really need some help with this. Thanks.

inigo
Joomla! Apprentice
Joomla! Apprentice
Posts: 19
Joined: Sun Dec 07, 2008 12:45 pm

Re: Space Between banners and remove border

Post by inigo » Thu Jan 08, 2009 9:57 pm

i have the same problem, any hints?

zago
Joomla! Apprentice
Joomla! Apprentice
Posts: 13
Joined: Fri Nov 30, 2007 6:55 am

Re: Space Between banners and remove border

Post by zago » Thu Jan 15, 2009 5:42 am

Same problem, any ideas? I could add a faux separation on my graphic, but that doesn't help because I have a border on linked images. There must be a more reasonable way to space out these images. CSS?

EDIT: My very unsophisticated solution has been to add a img reference in the template CSS like below:

a img{
padding-bottom: 5px;
border-top-style: none;
border-right-style: none;
border-bottom-style: none;
border-left-style: none;
}

It eliminates the border and adds the space, but of course the change is global so it will impact linked images other than the banners.

okmat
Joomla! Fledgling
Joomla! Fledgling
Posts: 3
Joined: Fri May 29, 2009 6:21 pm
Contact:

Re: Space Between banners and remove border

Post by okmat » Fri May 29, 2009 10:45 pm

This is how I did it:

open modules/mod_banners/helper.php

Find this code:

Code: Select all

else if (BannerHelper::isImage( $item->imageurl ))
      {
         $image    = '<img src="'.$baseurl.'images/banners/'.$item->imageurl.'" alt="'.JText::_('Banner').'" />';
add "vspace="10px" (or any value you like) after the img tag se the code looks like this:

Code: Select all

else if (BannerHelper::isImage( $item->imageurl ))
      {
         $image    = '<img vspace="10px" src="'.$baseurl.'images/banners/'.$item->imageurl.'" alt="'.JText::_('Banner').'" />';
As for the border, well, I haven't tested it but i'm sure you can add the border="0" attribute to the image tag as well.

Cheers



EDIT: while the previous mod works well on firefox, it doesn't work on IE7, so an easier way to add a vertical space between banners is to add a <br /> tag after the image tag like this:

Code: Select all

else if (BannerHelper::isImage( $item->imageurl ))
      {
         $image    = '<img src="'.$baseurl.'images/banners/'.$item->imageurl.'" alt="'.JText::_('Banner').'" /><br />';

User avatar
red2678
Joomla! Explorer
Joomla! Explorer
Posts: 281
Joined: Tue Apr 15, 2008 5:18 pm
Location: Los Angeles, CA

Re: Space Between banners and remove border

Post by red2678 » Wed Jun 10, 2009 2:11 am

Add the following (if not there) to your template's css file:

.banneritem img
{
display: block;
border:none;
margin-left: auto;
margin-right: auto;
margin-bottom:10px;
}

oddbrawl
Joomla! Apprentice
Joomla! Apprentice
Posts: 14
Joined: Fri Jan 18, 2008 4:20 pm

Re: Space Between banners and remove border

Post by oddbrawl » Sat Jul 03, 2010 4:33 am

red2678 wrote:Add the following (if not there) to your template's css file:

.banneritem img
{
display: block;
border:none;
margin-left: auto;
margin-right: auto;
margin-bottom:10px;
}
THANK YOU!


Locked

Return to “Templates for Joomla! 1.5”