zurb/foundation — Issue #170: Banners Spaces
Author: lonchbox
Created: 2011-12-15 11:44:52+00:00
State: open

Hi :)

I´m using foundation for a project and this project have something that most of the blogs, news sites, magazins use, is banners spaces, this days with rich media scripts for banners the thing goes tricky because I didn´t find any framwork wich have css or conception about banner space.
In this particular project I use a rich media banner wich is a composition of 120x600 left banner (skycrapper), 728x90 top banner (eaderboard) and 160x600 right banner (skycrapper), this rich media works like a frame arround the site, to use this banner with foundation I create a

outside and above the

, this banner works like the container but with different sizes:
#banner-space {
margin: 0 auto;
max-width: 1000px;
min-width: 1000px;
width: 100%;
}
But, if I don´t create this styles the banner is deformed.
#leaderboard object {
height: 90px;
}
#skycrapper-right object, #skycrapper-left object {
height: 600px;
}
I think this depend of how the adserver works but with the ones my client use this styles are fine.

In this way I center the banner but the site is not well centered, because the center of the container is not the center of the page if you add the banners, actually the center move some pixels to the right.

Other sizes more common are 300x250, 300x600, 125x125, 120x600, 160x600. indivdually not together like the rich media.

it´s necessary to do the banners responsive?, I think not, using show-on-desktop is more than enought.

Hope this info is usefull for someone, or get a better solution to my case is very welcome.