Responsive Grid Issue - Joomla! Forum - community, help and support

hi,

i need front page grid problem in mobile view.

here link dev site:

http://www.treetopwebdesign.com/clients/armada/index.php
user: ja
pass: jaforum12

i using joomla 2.5.8, university 1.3, yt widgetkit 1.3.1, ppc simple spotlight 2.7

i need have rotating banner 75% wide , random image loader next banner 25% wide. accomplishing responsive yt widgetkit (rotating banner) , non-responsive ppc simple spotlight (random image loader links). have created custom html mod , using following code published in user-5 position.

mod:

code: select all

<div class=" grid-2">{loadposition sliders}</div>
<div class=" grid-3">{loadposition spotlight}</div>

template css:

code: select all

. grid-2 {width:75%; float: left; display:inline;position: relative;margin: 0 5px;}
. grid-3 {width:20%; float: left; display:inline;position: relative;margin: 0 5px;}

this allow banner , image displayed in 75%/ 25% configuration. however, when viewed in ipad , iphone random image module gets cutoff , doesn’t display correctly.

i have tried many css grid % , px combinations , many widget kit combinations can’t seem right.

i can deal following solutions:

1. both banner & image responsive display
2. when display gets small 25% image moves below 75% banner image
3. when display gets small 25% image not displayed

any suggestions how can keep 75/25 layout , still have mobile display appreciated.

thank you!