grazie mille. seguendo le vostre indicazioni mi sembra di aver raggiunto l' obbiettivo.
ho usato il procedimento di intercettare la larghezza del dispositivo perche' con media only screen era da modificare troppo il CSS in quanto ci sono molti valori di setup di classi, ma io devo richiamare la classe a seconda del device.
ho risolto cosi' :
- nella head dichiaro le due classi mobileShow e mobileHide
codice HTML:
</style>
<style type="text/css">
.mobileShow {display: none;}
/* Smartphone Portrait and Landscape - per visualizzare su smartphone e non su PC - */
@media only screen
and (min-device-width : 320px)
and (max-device-width : 480px){
.mobileShow {display: inline;}
}
</style>
<style type="text/css">
.mobileHide { display: inline; }
/* Smartphone Portrait and Landscape - per visualizzare su PC e non su smartphone - */
@media only screen
and (min-device-width : 320px)
and (max-device-width : 480px){
.mobileHide { display: none;}
}
</style>
nel body
codice:
<div class="mobileHide"> <!-- hide class on smartphone-->
<div align="center">
<div class="12u">
<div align="center">
<div class="row">
<div class="2u">
..............
</div>
<div class="2u">
..............
</div>
</div>
</div>
</div>
</div>
</div> <!-- close the div for Hide-->
<div class="mobileShow"> <!-- Show class on smartphone-->
<div align="center">
<div class="12u">
<div align="center">
<div class="row">
<div class="4u">
..............
</div>
<div class="4u">
..............
</div>
</div>
</div>
</div>
</div>
</div> <!-- close the div for Show-->
Grazie mille dell' aiuto, e spero che questo codice possa aiutare qualcun altro.