Align banners left to next one

[kreativostudio]

HI I want to add a box, this box will have three banners inside, I want to align the so that each one is on the right.

maybe and image can explain it better

this is the code I am using

<div id="banners" class="box">
<div class="box_title_holder">
<div class="box_title">Next Events</div>
</div>
<div class="banners_box">
<vte:load module=" align="left"box_banners" search_zone_id="1" />
<vte:load module=" align="left"box_banners" search_zone_id="2" />
<vte:load module=" align="left"box_banners" search_zone_id="3" />
</div>
</div>

[northlandadv]

Set the style of banners_box to "inline". This should put them in a horizontal row as long as the width of the div will allow it.

.banners_box {
display: inline;
}

Not sure how much CSS you understand so feel free to ask for more of an explanation.

[Micha]

<vte:load module=" align="left"box_banners" search_zone_id="1" />

Also, I don't think you can place align="left" here like this.

[kreativostudio]

I have corrected the code and replace it with this

<div id="banners" class="box">
<div class="box_title_holder">
<div class="box_title">Next Events</div>
</div>
<div class="banners_box">
<vte:load module="box_banners" search_zone_id="1" />
<vte:load module="box_banners" search_zone_id="2" />
<vte:load module="box_banners" search_zone_id="3" />
</div>
</div>

I have add this code to my style.css
.banners_box {
display: inline;
}

But I can not make it work, any other suggestions? Banners show in column not in a row

[Micha]

You can try next solution (this is only if the banners are images, gif, jpg...).

Instead of
.banners_box {display: inline;}

try adding following code
.banners_box img {display: inline;}

or
.banners_box img {float: left; margin: 2px;}

[kreativostudio]

Thanks to both of you for the responses I have applied Micha's method and works perfect!

[northlandadv]

Good to hear. I did not mean for you to literally insert my proposed code, but use it as a guide. I wasn't sure how much CSS you knew :)

[Micha]

off topic

@ northlandadv

Don't Say It Can't Be Done! :D :D :D

[northlandadv]

phhhhhhht!

[Micha]

Hehehehe ;)
Btw, when you are launching customvivvo.org?
It's almost the end of June, and I'm pretty eager to see it :)

[northlandadv]

We're just waiting on a promised upgrade to our ecommerce package, and they said end of June. Everything is ready to load in, but we're afraid that there will be too many DB changes and we'll have to do it over, so we're being patient...

We're anxious too :)

[fher2000]

ok its works, but when i aling to left or right my my margin wides open to much and everything goes hell =( what can i do if i want to hold on the predefined margins on template??? tks a alot