Extra promo banners on SFNT misbehave on tablets or medium size screens

[Protos]

Hi, I put a couple of extra small banners during Easter holidays. http://dev2.cigarrummet.com/
Scaling on tablet or in browser makes the last two jump as in enclosed picture. sfnt.JPG

Adding <div class="breaker clear"></div> fixes it but adds an extra big space between my banners...
Can be seen on my prod page http://www.cigarrummet.com/ WhiteSpace.JPG


<div class="column whole align-center uppercase event-message h1 nm ultrabold heading-decoration"><mvt:item name="readytheme" param="banner( 'storefront-message' )" /></div>
<div class="breaker clear"></div>
<mvt:item name="readytheme" param="banner( 'adress' )" />
<div class="breaker clear"></div>
<div class="column hide medium-show medium-half align-center">
<mvt:item name="readytheme" param="image( 'storefront_promo' )" />
</div>
<div class="column whole medium-half align-center">
<mvt:item name="readytheme" param="image( 'storefront_new' )" />
</div>
<div class="column whole medium-half align-center">
<mvt:item name="readytheme" param="image( 'storefront_sale' )" />
</div>
<!--div class="breaker clear"></div-->
<div class="column whole medium-half align-center">
<mvt:item name="readytheme" param="image( 'storefront_extra' )" />
</div>
<div class="column whole medium-half align-center">
<mvt:item name="readytheme" param="image( 'storefront_extra_2' )" />
</div>
<div class="breaker clear"></div>

Is there a way to decrease space produced by the tag <div class="breaker clear"></div>. It functions well in all other places...

André Loutchko aka Protos, Stockholm

[Matt Zimmermann]

Hi André,

In the DIV you added, remove the 'breaker' class and the layout should look like you want.

[Protos]

Thanks Matt. Tried it this morning with just <div> /div> or <p>. The layout looks better. Still I am getting extra White Squares when resizing my Chrome to a tablet size (two i a row).
I guess I have to live with class tag that has stabilizing effect.
br.JPG

[Matt Zimmermann]

Hi André,

In your DEV site, you are just using a BR tag between the sections. If you add the 'clear' class to that BR, the layout should work like you want it.

[Protos]

Hello Matt and thanks a lot!
I was experimenting with div, p and br in the morning and forgot to clean up the code and restore the DIV tag.
Yes, now it works perfectly!
You made my day!

Regards from Sweden //André Loutchko