Changeset 74492 in spip-zone


Ignore:
Timestamp:
Jul 28, 2013, 2:41:41 PM (6 years ago)
Author:
kent1@…
Message:

layout un peu responsive

File:
1 edited

Legend:

Unmodified
Added
Removed
  • _squelettes_/mediaspip/mediaspip_core/trunk/css/layout.css

    r73356 r74492  
    2222        max-width:1000px;
    2323        position:relative;
    24         padding: 0 1%;
    2524}
    2625
     
    9695
    9796/* end */
     97
     98/************************************************************************************
     99        smaller than 980
     100*************************************************************************************/
     101@media screen and (max-width: 980px) {
     102        .content{
     103                padding:1%;
     104                -moz-box-sizing:border-box;
     105                -webkit-box-sizing:border-box;
     106                box-sizing:border-box;
     107        }
     108        body .header .accueil{
     109                width:auto;
     110        }
     111}
     112
     113/************************************************************************************
     114        smaller than 650
     115*************************************************************************************/
     116@media screen and (max-width: 650px) {
     117        .content{width:100%;}
     118        .extra1{width:48%;float:left;clear:both;}
     119        .extra2{width:48%;float:right;}
     120        body #content .medias ul.liste-items .vignette:nth-of-type(3n-2),
     121        body #content .medias ul.liste-items .vignette:nth-child(2n+1){
     122        clear: none;
     123        }
     124        body #content .medias ul.liste-items .vignette{
     125                width:47%;
     126        }
     127        #content .medias ul.liste-items .vignette:nth-child(odd)  {
     128        clear: both;
     129        }
     130}
     131
     132/************************************************************************************
     133        smaller than 480
     134*************************************************************************************/
     135@media screen and (max-width: 480px) {
     136    /* disable webkit text size adjust (for iPhone) */
     137    html {
     138        -webkit-text-size-adjust: none;
     139    }
     140
     141    body .page { position: relative; width: 96%; margin: 0; margin:0 2%; text-align: left;box-shadow:none; }
     142}
Note: See TracChangeset for help on using the changeset viewer.