Changeset 106141 in spip-zone


Ignore:
Timestamp:
Sep 7, 2017, 8:41:41 PM (22 months ago)
Author:
real3t@…
Message:

Une super astuce trouvée ici : https://stackoverflow.com/questions/1205159/html-css-making-two-floating-divs-the-same-height
Permet d'avoir des colonnes de hauteur équivalente sans la gymnastique javascript précédente.

Location:
_squelettes_/soyezcreateurs_net/trunk/plugins/soyezcreateurs
Files:
4 deleted
23 edited

Legend:

Unmodified
Added
Removed
  • _squelettes_/soyezcreateurs_net/trunk/plugins/soyezcreateurs/formulaires/configurer_soyezcreateurs.html

    r105820 r106141  
    4949                                        )]
    5050                                        pour avoir le mode événementiel]
     51                        </fieldset>
     52                        <p class="boutons">
     53                                <input type="submit" name="enregistrer" value="<:bouton_enregistrer|attribut_html:>" />
     54                        </p>
     55                        <fieldset>
     56                                <h3 class="legend"><:soyezcreateursprive:cfg_mode_affichage:></h3>
    5157                                        [(#SAISIE{radio,tri_slideshow_communiquant,
    5258                                                label=<:soyezcreateursprive:cfg_tri_slideshow_communiquant_label:>,
  • _squelettes_/soyezcreateurs_net/trunk/plugins/soyezcreateurs/javascripts.js.html

    r104728 r106141  
    108108}
    109109
    110 
    111 function adjustLayout() {
    112         /* Remettre la taille à auto pour trouver l'eventuelle nouvelle hauteur !*/
    113         $("div.equilibre").css({'height': 'auto'});
    114         /*******************************************CAS N°1********************************************************************/
    115         /*Nav, Contenu et Extra alignes top (Layout 1 a 22)*/
    116         var tnotstackable =0;
    117         tnotstackable = parseInt($("div.notstackable")[0].offsetTop);
    118         tlaststackable = parseInt($("div.laststackable")[0].offsetTop);
    119         if (tnotstackable==tlaststackable) {
    120                         var h=0;
    121                         $("div.equilibre").each(function(){ h=Math.max(h,this.offsetHeight); }).css({'min-height': h+'px'});
    122                         $("div.equilibre").css({'height': parseInt($("div.equilibre")[0].offsetHeight)});
    123                         /*alert("Cas 1");*/
    124         }
    125         else {
    126 /*********************************************CAS 2*********************************************************************/
    127         /* Navigation et Extra sont empiles (Layout 23 a 26 et 33 et 34)*/
    128                 leftlaststackable = parseInt($("div.laststackable")[0].offsetLeft);
    129                 leftnavigation = parseInt($("div#navigation")[0].offsetLeft);
    130                 largeurnavigation = parseInt($("div#navigation")[0].offsetWidth);
    131                 largeurextra = parseInt($("div.laststackable")[0].offsetWidth);
    132                 if ((leftlaststackable == leftnavigation) && (largeurextra == largeurnavigation)) {
    133                         var hstacked = 0;
    134                         $("div.stackable").each(function(){ hstacked+=parseInt(this.offsetHeight); });
    135                         var hnotstackable = 0;
    136                         hnotstackable = parseInt($("div.notstackable")[0].offsetHeight);
    137                         if (hnotstackable>hstacked) {
    138                                 $("div.laststackable").css({'min-height': hnotstackable + parseInt($("div.laststackable")[0].offsetHeight) - hstacked+'px'});
    139                                 $("div.notstackable").css({'min-height': hnotstackable+'px'});
    140                                 /*alert("Cas 2");*/
    141                         }
    142                         else {
    143                                 $("div.notstackable").css({'min-height': hstacked+'px'});
    144                         };
    145                 }
    146                 else {
    147 /**********************************************CAS 3*******************************************************************/
    148         /* Navigation et Extra meme Top et differents de Contenu (Layout 27-28-39-40)*/
    149                         tlaststackable = parseInt($("div.laststackable")[0].offsetTop);
    150                         tstackable = parseInt($("div.stackable")[0].offsetTop);
    151                         if (tstackable==tlaststackable){
    152                                 var h=0;
    153                                 $("div.stackable").each(function(){ h=Math.max(h,this.offsetHeight); }).css({'min-height': h+'px'});
    154                                 /*alert("Cas 3");*/
    155                         }
    156                         else {
    157 /**********************************************CAS 4*******************************************************************/
    158         /* Navigation et Contenu meme alignement Top (Layout 35 et 36)*/
    159                                 largeurcontenu = parseInt($("div.notstackable")[0].offsetWidth);
    160                                 if (largeurcontenu==largeurextra) {
    161                                         hstackable = (hauteurcontenu = parseInt($("div.notstackable")[0].offsetHeight)) + (hauteurext = parseInt($("div.laststackable")[0].offsetHeight));
    162                                         hnavigation = parseInt($("div#navigation")[0].offsetHeight);
    163                                         if(hstackable < hnavigation) {
    164                                                 $("div.notstackable").css({'min-height': (hnavigation - hauteurext)+'px'});
    165                                         }
    166                                         else {
    167                                                 $("div#navigation").css({'min-height': hstackable+'px'});
    168                                         }
    169                                         /*alert("Cas 4");*/
    170                                 }
    171                                 else    {
    172 /**********************************************CAS 5*******************************************************************/
    173         /* Navigation et Contenu meme alignement Top (Layout 29 a 32 et 37 et 38)*/
    174                                         hstackable = (hauteurcontenu = parseInt($("div.notstackable")[0].offsetHeight));
    175                                         hnavigation = parseInt($("div#navigation")[0].offsetHeight);
    176                                         if(hstackable > hnavigation) {
    177                                                 $("div#navigation").css({'min-height': hstackable+'px'});
    178                                         }
    179                                         else {
    180                                         $("div.notstackable").css({'min-height': hnavigation+'px'});
    181                                         }
    182                                         /*alert("Cas 5");*/
    183                                 }
    184                         }
    185                 }
    186         }
    187 }
    188 ;
    189110/* FUNCTIONS ON ALL PAGES */
    190111function myInitPages() {
     
    230151]
    231152        $(".escapelinks").one("focus", "a", function() { $(".escapelinks").removeClass("escapelinks"); } );
    232 }
    233 ;
    234 function myInitLayout() {
    235         if (CanceladjustLayout != true) {
    236                 adjustLayout();
    237                 $("body").resize(
    238                         function () {
    239                         adjustLayout();
    240                         }
    241                 );
    242                 if (CancelMonitorTextSize != true) {
    243                         $.em.element = $('<div />').css({ left:     '-100em',
    244                                                                                 position: 'absolute',
    245                                                                                 width:    '100em' })
    246                                                                  .prependTo('div.texte')[0];
    247                         $('div.texte').bind('emchange', function(e, cur, prev) { adjustLayout(); });
    248                 }
    249                 onAjaxLoad(adjustLayout); // Merci Marcimat sur IRC !
    250         }
    251 ;
    252153}
    253154;
     
    825726$(document).ready(function() {
    826727        myInitPages();
    827         // Ceci devrait régler le problème de l'ajustement des colonne pas toujours fait
    828         $(window).on('load',function() {
    829                 myInitLayout();
    830         });
    831728});
    832729
  • _squelettes_/soyezcreateurs_net/trunk/plugins/soyezcreateurs/layout.css.html

    r98252 r106141  
    1414/* http://blog.html.it/layoutgala/index.html */
    1515[(#ENV{layoutgala}|=={1}|oui)/* 1 */
    16 div#wrapper{float:left;width:100%}
    17 div#content{margin: 0 25%}
    18 div#navigation{float:left;width:25%;margin-left:-100%}
    19 div#extra{float:left;width:25%;margin-left:-25%}
    20 div#footer{clear:left;width:100%}
     16#wrapper{float:left;width:100%}
     17#content{margin: 0 25%}
     18#navigation{float:left;width:25%;margin-left:-100%}
     19#extra{float:left;width:25%;margin-left:-25%}
     20#footer{clear:left;width:100%}
    2121][(#ENV{layoutgala}|=={2}|oui)/* 2 */
    22 div#wrapper{float:left;width:100%}
    23 div#content{margin: 0 25%}
    24 div#navigation{float:left;width:25%;margin-left:-25%}
    25 div#extra{float:left;width:25%;margin-left:-100%}
    26 div#footer{clear:left;width:100%}
    27 @media (max-width: [(#GET{LargeurContaineur})]px) {
    28 div#navigation{float:right;width:50%}
    29 div#extra{float:left;width:50%}
     22#wrapper{float:left;width:100%}
     23#content{margin: 0 25%}
     24#navigation{float:left;width:25%;margin-left:-25%}
     25#extra{float:left;width:25%;margin-left:-100%}
     26#footer{clear:left;width:100%}
     27@media (max-width: [(#GET{LargeurContaineur})]px) {
     28#navigation{float:right;width:50%}
     29#extra{float:left;width:50%}
    3030}][(#ENV{layoutgala}|=={3}|oui)/* 3 */
    31 div#wrapper{float:left;width:100%}
    32 div#content{margin-right: 50%}
    33 div#navigation{float:left;width:25%;margin-left:-50%}
    34 div#extra{float:left;width:25%;margin-left:-25%}
    35 div#footer{clear:left;width:100%}
     31#wrapper{float:left;width:100%}
     32#content{margin-right: 50%}
     33#navigation{float:left;width:25%;margin-left:-50%}
     34#extra{float:left;width:25%;margin-left:-25%}
     35#footer{clear:left;width:100%}
    3636][(#ENV{layoutgala}|=={4}|oui)/* 4 */
    37 div#wrapper{float:left;width:100%}
    38 div#content{margin-right: 50%}
    39 div#navigation{float:left;width:25%;margin-left:-25%}
    40 div#extra{float:left;width:25%;margin-left:-50%}
    41 div#footer{clear:left;width:100%}
    42 @media (max-width: [(#GET{LargeurContaineur})]px) {
    43 div#navigation{float:right;width:50%}
    44 div#extra{float:left;width:50%}
     37#wrapper{float:left;width:100%}
     38#content{margin-right: 50%}
     39#navigation{float:left;width:25%;margin-left:-25%}
     40#extra{float:left;width:25%;margin-left:-50%}
     41#footer{clear:left;width:100%}
     42@media (max-width: [(#GET{LargeurContaineur})]px) {
     43#navigation{float:right;width:50%}
     44#extra{float:left;width:50%}
    4545}][(#ENV{layoutgala}|=={5}|oui)/* 5 */
    46 div#wrapper{float:left;width:100%}
    47 div#content{margin-left: 50%}
    48 div#navigation{float:left;width:25%;margin-left:-100%}
    49 div#extra{float:left;width:25%;margin-left:-75%}
    50 div#footer{clear:left;width:100%}
     46#wrapper{float:left;width:100%}
     47#content{margin-left: 50%}
     48#navigation{float:left;width:25%;margin-left:-100%}
     49#extra{float:left;width:25%;margin-left:-75%}
     50#footer{clear:left;width:100%}
    5151][(#ENV{layoutgala}|=={6}|oui)/* 6 */
    52 div#wrapper{float:left;width:100%}
    53 div#content{margin-left: 50%}
    54 div#navigation{float:left;width:25%;margin-left:-75%}
    55 div#extra{float:left;width:25%;margin-left:-100%}
    56 div#footer{clear:left;width:100%}
    57 @media (max-width: [(#GET{LargeurContaineur})]px) {
    58 div#navigation{float:right;width:50%}
    59 div#extra{float:left;width:50%}
     52#wrapper{float:left;width:100%}
     53#content{margin-left: 50%}
     54#navigation{float:left;width:25%;margin-left:-75%}
     55#extra{float:left;width:25%;margin-left:-100%}
     56#footer{clear:left;width:100%}
     57@media (max-width: [(#GET{LargeurContaineur})]px) {
     58#navigation{float:right;width:50%}
     59#extra{float:left;width:50%}
    6060}][(#ENV{layoutgala}|=={7}|oui)/* 7 */
    61 div#container{width:#GET{LargeurContaineurOmbres}px;margin:0 auto}
    62 div#wrapper{float:left;width:100%}
    63 div#content{margin: 0 #GET{LargeurMenuDroitOmbre}px 0 #GET{LargeurMenuGaucheOmbre}px}
    64 div#navigation{float:left;width:#GET{LargeurMenuGauche}px;margin-left:-#GET{LargeurContaineurOmbre}px}
    65 div#extra{float:left;width:#GET{LargeurMenuDroit}px;margin-left:-#GET{LargeurMenuDroitOmbre}px}
    66 div#footer{clear:left;width:100%}
     61#container{width:#GET{LargeurContaineurOmbres}px;margin:0 auto}
     62#wrapper{float:left;width:100%}
     63#content{margin: 0 #GET{LargeurMenuDroitOmbre}px 0 #GET{LargeurMenuGaucheOmbre}px}
     64#navigation{float:left;width:#GET{LargeurMenuGauche}px;margin-left:-#GET{LargeurContaineurOmbre}px}
     65#extra{float:left;width:#GET{LargeurMenuDroit}px;margin-left:-#GET{LargeurMenuDroitOmbre}px}
     66#footer{clear:left;width:100%}
    6767][(#ENV{layoutgala}|=={8}|oui)/* 8 */
    68 div#container{width:#GET{LargeurContaineurOmbres}px;margin:0 auto}
    69 div#wrapper{float:left;width:100%}
    70 div#content{margin: 0 #GET{LargeurMenuGauche}px 0 #GET{LargeurMenuDroit}px}
    71 div#navigation{float:left;width:#GET{LargeurMenuGauche}px;margin-left:-#GET{LargeurMenuGauche}px}
    72 div#extra{float:left;width:#GET{LargeurMenuDroit}px;margin-left:-#GET{LargeurContaineur}px}
    73 div#footer{clear:left;width:100%}
    74 @media (max-width: [(#GET{LargeurContaineur})]px) {
    75 div#navigation{float:right;width:50%}
    76 div#extra{float:left;width:50%}
     68#container{width:#GET{LargeurContaineurOmbres}px;margin:0 auto}
     69#wrapper{float:left;width:100%}
     70#content{margin: 0 #GET{LargeurMenuGauche}px 0 #GET{LargeurMenuDroit}px}
     71#navigation{float:left;width:#GET{LargeurMenuGauche}px;margin-left:-#GET{LargeurMenuGauche}px}
     72#extra{float:left;width:#GET{LargeurMenuDroit}px;margin-left:-#GET{LargeurContaineur}px}
     73#footer{clear:left;width:100%}
     74@media (max-width: [(#GET{LargeurContaineur})]px) {
     75#navigation{float:right;width:50%}
     76#extra{float:left;width:50%}
    7777}][(#ENV{layoutgala}|=={9}|oui)/* 9 */
    78 div#container{width:#GET{LargeurContaineurOmbres}px;margin:0 auto}
    79 div#wrapper{float:left;width:100%}
    80 div#content{margin-right:[(#GET{LargeurMenuGauche}|plus{#GET{LargeurMenuDroit}})]px}
    81 div#navigation{float:left;width:#GET{LargeurMenuGauche}px;margin-left:-[(#GET{LargeurMenuGauche}|plus{#GET{LargeurMenuDroit}})]px}
    82 div#extra{float:left;width:#GET{LargeurMenuDroit}px;margin-left:-#GET{LargeurMenuDroit}px}
    83 div#footer{clear:left;width:100%}
     78#container{width:#GET{LargeurContaineurOmbres}px;margin:0 auto}
     79#wrapper{float:left;width:100%}
     80#content{margin-right:[(#GET{LargeurMenuGauche}|plus{#GET{LargeurMenuDroit}})]px}
     81#navigation{float:left;width:#GET{LargeurMenuGauche}px;margin-left:-[(#GET{LargeurMenuGauche}|plus{#GET{LargeurMenuDroit}})]px}
     82#extra{float:left;width:#GET{LargeurMenuDroit}px;margin-left:-#GET{LargeurMenuDroit}px}
     83#footer{clear:left;width:100%}
    8484][(#ENV{layoutgala}|=={10}|oui)/* 10 */
    85 div#container{width:#GET{LargeurContaineurOmbres}px;margin:0 auto}
    86 div#wrapper{float:left;width:100%}
    87 div#content{margin-right:[(#GET{LargeurMenuGauche}|plus{#GET{LargeurMenuDroit}})]px}
    88 div#navigation{float:left;width:#GET{LargeurMenuGauche}px;margin-left:-#GET{LargeurMenuGauche}px}
    89 div#extra{float:left;width:#GET{LargeurMenuDroit}px;margin-left:-[(#GET{LargeurMenuGauche}|plus{#GET{LargeurMenuDroit}})]px}
    90 div#footer{clear:left;width:100%}
    91 @media (max-width: [(#GET{LargeurContaineur})]px) {
    92 div#navigation{float:right;width:50%}
    93 div#extra{float:left;width:50%}
     85#container{width:#GET{LargeurContaineurOmbres}px;margin:0 auto}
     86#wrapper{float:left;width:100%}
     87#content{margin-right:[(#GET{LargeurMenuGauche}|plus{#GET{LargeurMenuDroit}})]px}
     88#navigation{float:left;width:#GET{LargeurMenuGauche}px;margin-left:-#GET{LargeurMenuGauche}px}
     89#extra{float:left;width:#GET{LargeurMenuDroit}px;margin-left:-[(#GET{LargeurMenuGauche}|plus{#GET{LargeurMenuDroit}})]px}
     90#footer{clear:left;width:100%}
     91@media (max-width: [(#GET{LargeurContaineur})]px) {
     92#navigation{float:right;width:50%}
     93#extra{float:left;width:50%}
    9494}][(#ENV{layoutgala}|=={11}|oui)/* 11 */
    95 div#container{width:#GET{LargeurContaineurOmbres}px;margin:0 auto}
    96 div#wrapper{float:left;width:100%}
    97 div#content{margin-left: [(#GET{LargeurMenuGauche}|plus{#GET{LargeurMenuDroit}})]px}
    98 div#navigation{float:left;width:#GET{LargeurMenuGauche}px;margin-left:-#GET{LargeurContaineur}px}
    99 div#extra{float:left;width:#GET{LargeurMenuDroit}px;margin-left:-[(#GET{LargeurContaineur}|moins{#GET{LargeurMenuGauche}})]px}
    100 div#footer{clear:left;width:100%}
     95#container{width:#GET{LargeurContaineurOmbres}px;margin:0 auto}
     96#wrapper{float:left;width:100%}
     97#content{margin-left: [(#GET{LargeurMenuGauche}|plus{#GET{LargeurMenuDroit}})]px}
     98#navigation{float:left;width:#GET{LargeurMenuGauche}px;margin-left:-#GET{LargeurContaineur}px}
     99#extra{float:left;width:#GET{LargeurMenuDroit}px;margin-left:-[(#GET{LargeurContaineur}|moins{#GET{LargeurMenuGauche}})]px}
     100#footer{clear:left;width:100%}
    101101][(#ENV{layoutgala}|=={12}|oui)/* 12 */
    102 div#container{width:#GET{LargeurContaineurOmbres}px;margin:0 auto}
    103 div#wrapper{float:left;width:100%}
    104 div#content{margin-left: [(#GET{LargeurMenuGauche}|plus{#GET{LargeurMenuDroit}})]px}
    105 div#navigation{float:left;width:#GET{LargeurMenuGauche}px;margin-left:-[(#GET{LargeurContaineur}|moins{#GET{LargeurMenuDroit}})]px}
    106 div#extra{float:left;width:#GET{LargeurMenuDroit}px;margin-left:-#GET{LargeurContaineur}px}
    107 div#footer{clear:left;width:100%}
    108 @media (max-width: [(#GET{LargeurContaineur})]px) {
    109 div#navigation{float:right;width:50%}
    110 div#extra{float:left;width:50%}
     102#container{width:#GET{LargeurContaineurOmbres}px;margin:0 auto}
     103#wrapper{float:left;width:100%}
     104#content{margin-left: [(#GET{LargeurMenuGauche}|plus{#GET{LargeurMenuDroit}})]px}
     105#navigation{float:left;width:#GET{LargeurMenuGauche}px;margin-left:-[(#GET{LargeurContaineur}|moins{#GET{LargeurMenuDroit}})]px}
     106#extra{float:left;width:#GET{LargeurMenuDroit}px;margin-left:-#GET{LargeurContaineur}px}
     107#footer{clear:left;width:100%}
     108@media (max-width: [(#GET{LargeurContaineur})]px) {
     109#navigation{float:right;width:50%}
     110#extra{float:left;width:50%}
    111111}][(#ENV{layoutgala}|=={13}|oui)/* 13 */
    112 div#wrapper{float:left;width:100%;}
    113 div#content{margin: 0 #GET{LargeurMenuDroit}px 0 #GET{LargeurMenuGauche}px}
    114 div#navigation{float:left;width:#GET{LargeurMenuGauche}px;margin-left:-100%}
    115 div#extra{float:left;width:#GET{LargeurMenuDroit}px;margin-left:-#GET{LargeurMenuDroit}px}
    116 div#footer{clear:left;width:100%}
     112#wrapper{float:left;width:100%;}
     113#content{margin: 0 #GET{LargeurMenuDroit}px 0 #GET{LargeurMenuGauche}px}
     114#navigation{float:left;width:#GET{LargeurMenuGauche}px;margin-left:-100%}
     115#extra{float:left;width:#GET{LargeurMenuDroit}px;margin-left:-#GET{LargeurMenuDroit}px}
     116#footer{clear:left;width:100%}
    117117][(#ENV{layoutgala}|=={14}|oui)/* 14 */
    118 div#wrapper{float:left;width:100%}
    119 div#content{margin: 0 #GET{LargeurMenuGauche}px 0 #GET{LargeurMenuDroit}px}
    120 div#navigation{float:left;width:#GET{LargeurMenuGauche}px;margin-left:-#GET{LargeurMenuGauche}px}
    121 div#extra{float:left;width:#GET{LargeurMenuDroit}px;margin-left:-100%}
    122 div#footer{clear:left;width:100%}
    123 @media (max-width: [(#GET{LargeurContaineur})]px) {
    124 div#navigation{float:right;width:50%}
    125 div#extra{float:left;width:50%}
     118#wrapper{float:left;width:100%}
     119#content{margin: 0 #GET{LargeurMenuGauche}px 0 #GET{LargeurMenuDroit}px}
     120#navigation{float:left;width:#GET{LargeurMenuGauche}px;margin-left:-#GET{LargeurMenuGauche}px}
     121#extra{float:left;width:#GET{LargeurMenuDroit}px;margin-left:-100%}
     122#footer{clear:left;width:100%}
     123@media (max-width: [(#GET{LargeurContaineur})]px) {
     124#navigation{float:right;width:50%}
     125#extra{float:left;width:50%}
    126126}][(#ENV{layoutgala}|=={15}|oui)/* 15 */
    127 div#wrapper{float:left;width:100%}
    128 div#content{margin-right: [(#GET{LargeurMenuGauche}|plus{#GET{LargeurMenuDroit}})]px}
    129 div#navigation{float:left;width:#GET{LargeurMenuGauche}px;margin-left:-[(#GET{LargeurMenuGauche}|plus{#GET{LargeurMenuDroit}})]px}
    130 div#extra{float:left;width:#GET{LargeurMenuDroit}px;margin-left:-#GET{LargeurMenuDroit}px}
    131 div#footer{clear:left;width:100%}
     127#wrapper{float:left;width:100%}
     128#content{margin-right: [(#GET{LargeurMenuGauche}|plus{#GET{LargeurMenuDroit}})]px}
     129#navigation{float:left;width:#GET{LargeurMenuGauche}px;margin-left:-[(#GET{LargeurMenuGauche}|plus{#GET{LargeurMenuDroit}})]px}
     130#extra{float:left;width:#GET{LargeurMenuDroit}px;margin-left:-#GET{LargeurMenuDroit}px}
     131#footer{clear:left;width:100%}
    132132][(#ENV{layoutgala}|=={16}|oui)/* 16 */
    133 div#wrapper{float:left;width:100%}
    134 div#content{margin-right: [(#GET{LargeurMenuGauche}|plus{#GET{LargeurMenuDroit}})]px}
    135 div#navigation{float:left;width:#GET{LargeurMenuGauche}px;margin-left:-#GET{LargeurMenuGauche}px}
    136 div#extra{float:left;width:#GET{LargeurMenuDroit}px;margin-left:-[(#GET{LargeurMenuGauche}|plus{#GET{LargeurMenuDroit}})]px}
    137 div#footer{clear:left;width:100%}
    138 @media (max-width: [(#GET{LargeurContaineur})]px) {
    139 div#navigation{float:right;width:50%}
    140 div#extra{float:left;width:50%}
     133#wrapper{float:left;width:100%}
     134#content{margin-right: [(#GET{LargeurMenuGauche}|plus{#GET{LargeurMenuDroit}})]px}
     135#navigation{float:left;width:#GET{LargeurMenuGauche}px;margin-left:-#GET{LargeurMenuGauche}px}
     136#extra{float:left;width:#GET{LargeurMenuDroit}px;margin-left:-[(#GET{LargeurMenuGauche}|plus{#GET{LargeurMenuDroit}})]px}
     137#footer{clear:left;width:100%}
     138@media (max-width: [(#GET{LargeurContaineur})]px) {
     139#navigation{float:right;width:50%}
     140#extra{float:left;width:50%}
    141141}][(#ENV{layoutgala}|=={17}|oui)/* 17 */
    142 div#wrapper{float:right;width: 100%;margin-left: -[(#GET{LargeurMenuGauche}|plus{#GET{LargeurMenuDroit}})]px}
    143 div#content{margin-left:[(#GET{LargeurMenuGauche}|plus{#GET{LargeurMenuDroit}})]px}
    144 div#navigation{float:right;width:#GET{LargeurMenuGauche}px}
    145 div#extra{float:right;width:#GET{LargeurMenuDroit}px}
    146 div#footer{clear:right;width:100%}
    147 @media (max-width: [(#GET{LargeurContaineur})]px) {
    148 div#navigation{float:right;width:50%}
    149 div#extra{float:left;width:50%}
     142#wrapper{float:right;width: 100%;margin-left: -[(#GET{LargeurMenuGauche}|plus{#GET{LargeurMenuDroit}})]px}
     143#content{margin-left:[(#GET{LargeurMenuGauche}|plus{#GET{LargeurMenuDroit}})]px}
     144#navigation{float:right;width:#GET{LargeurMenuGauche}px}
     145#extra{float:right;width:#GET{LargeurMenuDroit}px}
     146#footer{clear:right;width:100%}
     147@media (max-width: [(#GET{LargeurContaineur})]px) {
     148#navigation{float:right;width:50%}
     149#extra{float:left;width:50%}
    150150}][(#ENV{layoutgala}|=={18}|oui)/* 18 */
    151 div#wrapper{float:right;width: 100%;margin-left: -[(#GET{LargeurMenuGauche}|plus{#GET{LargeurMenuDroit}})]px}
    152 div#content{margin-left:[(#GET{LargeurMenuGauche}|plus{#GET{LargeurMenuDroit}})]px}
    153 div#navigation{float:left;width: #GET{LargeurMenuGauche}px}
    154 div#extra{float:right;width:#GET{LargeurMenuDroit}px}
    155 div#footer{clear:both;width:100%}
     151#wrapper{float:right;width: 100%;margin-left: -[(#GET{LargeurMenuGauche}|plus{#GET{LargeurMenuDroit}})]px}
     152#content{margin-left:[(#GET{LargeurMenuGauche}|plus{#GET{LargeurMenuDroit}})]px}
     153#navigation{float:left;width: #GET{LargeurMenuGauche}px}
     154#extra{float:right;width:#GET{LargeurMenuDroit}px}
     155#footer{clear:both;width:100%}
    156156][(#ENV{layoutgala}|=={19}|oui)/* 19 */
    157 div#wrapper{float:left;width:100%}
    158 div#content{margin: 0 33% 0 #GET{LargeurMenuGauche}px}
    159 div#navigation{float:left;width:#GET{LargeurMenuGauche}px;margin-left:-100%}
    160 div#extra{float:left;width:33%;margin-left:-33%}
    161 div#footer{clear:left;width:100%}
     157#wrapper{float:left;width:100%}
     158#content{margin: 0 33% 0 #GET{LargeurMenuGauche}px}
     159#navigation{float:left;width:#GET{LargeurMenuGauche}px;margin-left:-100%}
     160#extra{float:left;width:33%;margin-left:-33%}
     161#footer{clear:left;width:100%}
    162162][(#ENV{layoutgala}|=={20}|oui)/* 20 */
    163 div#wrapper{float:left;width:100%}
    164 div#content{margin: 0 #GET{LargeurMenuDroit}px 0 33%}
    165 div#navigation{float:left;width:33%;margin-left:-100%}
    166 div#extra{float:left;width:#GET{LargeurMenuDroit}px;margin-left:-#GET{LargeurMenuDroit}px}
    167 div#footer{clear:left;width:100%}
     163#wrapper{float:left;width:100%}
     164#content{margin: 0 #GET{LargeurMenuDroit}px 0 33%}
     165#navigation{float:left;width:33%;margin-left:-100%}
     166#extra{float:left;width:#GET{LargeurMenuDroit}px;margin-left:-#GET{LargeurMenuDroit}px}
     167#footer{clear:left;width:100%}
    168168][(#ENV{layoutgala}|=={21}|oui)/* 21 */
    169 div#wrapper{float:left;width:100%;margin-left:-25%}
    170 div#content{margin: 0 #GET{LargeurMenuGauche}px 0 25%}
    171 div#navigation{float:left;width:#GET{LargeurMenuGauche}px;margin-left:-#GET{LargeurMenuGauche}px}
    172 div#extra{float:left;width:25%}
    173 div#footer{clear:left;width:100%}
     169#wrapper{float:left;width:100%;margin-left:-25%}
     170#content{margin: 0 #GET{LargeurMenuGauche}px 0 25%}
     171#navigation{float:left;width:#GET{LargeurMenuGauche}px;margin-left:-#GET{LargeurMenuGauche}px}
     172#extra{float:left;width:25%}
     173#footer{clear:left;width:100%}
    174174][(#ENV{layoutgala}|=={22}|oui)/* 22 */
    175 div#wrapper{float:left;width:100%;margin-left:-#GET{LargeurMenuDroit}px}
    176 div#content{margin: 0 25% 0 #GET{LargeurMenuDroit}px}
    177 div#navigation{float:left;width:25%;margin-left:-25%}
    178 div#extra{float:left;width:#GET{LargeurMenuDroit}px}
    179 div#footer{clear:left;width:100%}
     175#wrapper{float:left;width:100%;margin-left:-#GET{LargeurMenuDroit}px}
     176#content{margin: 0 25% 0 #GET{LargeurMenuDroit}px}
     177#navigation{float:left;width:25%;margin-left:-25%}
     178#extra{float:left;width:#GET{LargeurMenuDroit}px}
     179#footer{clear:left;width:100%}
    180180][(#ENV{layoutgala}|=={23}|oui)/* 23 */
    181 div#wrapper{float:left;width:100%;margin-left:-#GET{LargeurMenuGauche}px}
    182 div#content{margin-left:#GET{LargeurMenuGauche}px}
    183 div#navigation{float:right;width:#GET{LargeurMenuGauche}px}
    184 div#extra{float:right;clear:right;width:#GET{LargeurMenuGauche}px}
    185 div#footer{clear:both;width:100%}
    186 @media (max-width: [(#GET{LargeurContaineur})]px) {
    187 div#wrapper{margin-left:0}
    188 div#navigation{float:left;width:50%}
    189 div#extra{float:left;width:50%;}
     181#wrapper{float:left;width:100%;margin-left:-#GET{LargeurMenuGauche}px}
     182#content{margin-left:#GET{LargeurMenuGauche}px}
     183#navigation{float:right;width:#GET{LargeurMenuGauche}px}
     184#extra{float:right;clear:right;width:#GET{LargeurMenuGauche}px}
     185#footer{clear:both;width:100%}
     186@media (max-width: [(#GET{LargeurContaineur})]px) {
     187#wrapper{margin-left:0}
     188#navigation{float:left;width:50%}
     189#extra{float:left;width:50%;}
    190190}][(#ENV{layoutgala}|=={24}|oui)/* 24 */
    191 div#wrapper{float:right;width:100%;margin-left:-#GET{LargeurMenuGauche}px}
    192 div#content{margin-left:#GET{LargeurMenuGauche}px}
    193 div#navigation{float:left;width:#GET{LargeurMenuGauche}px}
    194 div#extra{float:left;clear:left;width:#GET{LargeurMenuGauche}px}
    195 div#footer{clear:both;width:100%}
    196 @media (max-width: [(#GET{LargeurContaineur})]px) {
    197 div#wrapper{margin-left:0}
    198 div#navigation{float:left;width:50%}
    199 div#extra{float:left;width:50%;clear:none;}
     191#wrapper{float:right;width:100%;margin-left:-#GET{LargeurMenuGauche}px}
     192#content{margin-left:#GET{LargeurMenuGauche}px}
     193#navigation{float:left;width:#GET{LargeurMenuGauche}px}
     194#extra{float:left;clear:left;width:#GET{LargeurMenuGauche}px}
     195#footer{clear:both;width:100%}
     196@media (max-width: [(#GET{LargeurContaineur})]px) {
     197#wrapper{margin-left:0}
     198#navigation{float:left;width:50%}
     199#extra{float:left;width:50%;clear:none;}
    200200}][(#ENV{layoutgala}|=={25}|oui)/* 25 */
    201 div#wrapper{float:left;width:100%;margin-left:-33%}
    202 div#content{margin-left:33%}
    203 div#navigation{float:right;width:32.9%}
    204 div#extra{float:right;clear:right;width:32.9%}
    205 div#footer{clear:both;width:100%}
    206 @media (max-width: [(#GET{LargeurContaineur})]px) {
    207 div#wrapper{margin-left:0}
    208 div#navigation{float:left;width:50%}
    209 div#extra{float:left;width:50%;clear:none;}
     201#wrapper{float:left;width:100%;margin-left:-33%}
     202#content{margin-left:33%}
     203#navigation{float:right;width:32.9%}
     204#extra{float:right;clear:right;width:32.9%}
     205#footer{clear:both;width:100%}
     206@media (max-width: [(#GET{LargeurContaineur})]px) {
     207#wrapper{margin-left:0}
     208#navigation{float:left;width:50%}
     209#extra{float:left;width:50%;clear:none;}
    210210}][(#ENV{layoutgala}|=={26}|oui)/* 26 */
    211 div#wrapper{float:right;width:80%;}
    212 div#navigation{float:left;width:20%}
    213 div#extra{float:left;clear:left;width:20%}
    214 div#footer{clear:both;width:100%}
    215 @media (max-width: [(#GET{LargeurContaineur})]px) {
    216 div#wrapper{margin-left:0}
    217 div#navigation{float:left;width:50%}
    218 div#extra{float:left;width:50%;clear:none;}
     211#wrapper{float:right;width:80%;}
     212#navigation{float:left;width:20%}
     213#extra{float:left;clear:left;width:20%}
     214#footer{clear:both;width:100%}
     215@media (max-width: [(#GET{LargeurContaineur})]px) {
     216#wrapper{margin-left:0}
     217#navigation{float:left;width:50%}
     218#extra{float:left;width:50%;clear:none;}
    219219}][(#ENV{layoutgala}|=={62}|oui)/* 26 modifie - identifiant 62 */
    220 div#wrapper{float:right;width:80%;margin-left:-.5%}
    221 div#navigation{float:left;width:20.5%}
    222 div#extra{float:left;clear:left;width:20%}
    223 div#footer{clear:both;width:100%}
     220#wrapper{float:right;width:80%;margin-left:-.5%}
     221#navigation{float:left;width:20.5%}
     222#extra{float:left;clear:left;width:20%}
     223#footer{clear:both;width:100%}
    224224][(#ENV{layoutgala}|=={27}|oui)/* 27 */
    225 div#navigation{float:left;width:50%}
    226 div#extra{float:left;width:49.9%}
    227 div#footer{clear:left;width:100%}
     225#navigation{float:left;width:50%}
     226#extra{float:left;width:49.9%}
     227#footer{clear:left;width:100%}
    228228][(#ENV{layoutgala}|=={28}|oui)/* 28 */
    229 div#navigation{float:right;width:50%}
    230 div#extra{float:right;width:49.9%}
    231 div#footer{clear:right;width:100%}
    232 @media (max-width: [(#GET{LargeurContaineur})]px) {
    233 div#navigation{float:right;width:50%}
    234 div#extra{float:left;width:50%}
     229#navigation{float:right;width:50%}
     230#extra{float:right;width:49.9%}
     231#footer{clear:right;width:100%}
     232@media (max-width: [(#GET{LargeurContaineur})]px) {
     233#navigation{float:right;width:50%}
     234#extra{float:left;width:50%}
    235235}][(#ENV{layoutgala}|=={29}|oui)/* 29 */
    236 div#wrapper{float:right;width:70%}
    237 div#navigation{float:left;width:29.9%}
    238 div#extra{clear:both;width:100%}
    239 @media (max-width: [(#GET{LargeurContaineur})]px) {
    240 div#wrapper{float:none; width:100%;}
    241 div#navigation{float:left;width:50%}
    242 div#extra{float:left;width:50%;clear:none;}
    243 div#footer{clear:left;width:100%}
     236#wrapper{float:right;width:70%}
     237#navigation{float:left;width:29.9%}
     238#extra{clear:both;width:100%}
     239@media (max-width: [(#GET{LargeurContaineur})]px) {
     240#wrapper{float:none; width:100%;}
     241#navigation{float:left;width:50%}
     242#extra{float:left;width:50%;clear:none;}
     243#footer{clear:left;width:100%}
    244244}][(#ENV{layoutgala}|=={30}|oui)/* 30 */
    245 div#wrapper{float:left;width:70%}
    246 div#navigation{float:right;width:29.9%}
    247 div#extra{clear:both;width:100%}
    248 @media (max-width: [(#GET{LargeurContaineur})]px) {
    249 div#wrapper{float:none; width:100%;}
    250 div#navigation{float:left;width:50%}
    251 div#extra{float:left;width:50%;clear:none;}
    252 div#footer{clear:left;width:100%}
     245#wrapper{float:left;width:70%}
     246#navigation{float:right;width:29.9%}
     247#extra{clear:both;width:100%}
     248@media (max-width: [(#GET{LargeurContaineur})]px) {
     249#wrapper{float:none; width:100%;}
     250#navigation{float:left;width:50%}
     251#extra{float:left;width:50%;clear:none;}
     252#footer{clear:left;width:100%}
    253253}][(#ENV{layoutgala}|=={31}|oui)/* 31 */
    254 div#wrapper{float:left;width:100%;}
    255 div#content{margin-left:#GET{LargeurMenuGauche}px}
    256 div#navigation{float:left;width:#GET{LargeurMenuGauche}px;margin-left:-100%}
    257 div#extra{clear:left;width:100%}
    258 @media (max-width: [(#GET{LargeurContaineur})]px) {
    259 div#wrapper{float:none; width:100%;}
    260 div#navigation{float:left;width:50%}
    261 div#extra{float:left;width:50%;clear:none;}
    262 div#footer{clear:left;width:100%}
     254#wrapper{float:left;width:100%;}
     255#content{margin-left:#GET{LargeurMenuGauche}px}
     256#navigation{float:left;width:#GET{LargeurMenuGauche}px;margin-left:-100%}
     257#extra{clear:left;width:100%}
     258@media (max-width: [(#GET{LargeurContaineur})]px) {
     259#wrapper{float:none; width:100%;}
     260#navigation{float:left;width:50%}
     261#extra{float:left;width:50%;clear:none;}
     262#footer{clear:left;width:100%}
    263263}][(#ENV{layoutgala}|=={32}|oui)/* 32 */
    264 div#wrapper{float:left;width:100%}
    265 div#content{margin-right:#GET{LargeurMenuGauche}px}
    266 div#navigation{float:left;width:#GET{LargeurMenuGauche}px;margin-left:-#GET{LargeurMenuGauche}px}
    267 div#extra{clear:left;width:100%}
    268 @media (max-width: [(#GET{LargeurContaineur})]px) {
    269 div#wrapper{float:none; width:100%;}
    270 div#navigation{float:left;width:50%}
    271 div#extra{float:left;width:50%;clear:none;}
    272 div#footer{clear:left;width:100%}
     264#wrapper{float:left;width:100%}
     265#content{margin-right:#GET{LargeurMenuGauche}px}
     266#navigation{float:left;width:#GET{LargeurMenuGauche}px;margin-left:-#GET{LargeurMenuGauche}px}
     267#extra{clear:left;width:100%}
     268@media (max-width: [(#GET{LargeurContaineur})]px) {
     269#wrapper{float:none; width:100%;}
     270#navigation{float:left;width:50%}
     271#extra{float:left;width:50%;clear:none;}
     272#footer{clear:left;width:100%}
    273273}][(#ENV{layoutgala}|=={33}|oui)/* 33 */
    274 div#container{width:#GET{LargeurContaineurOmbres}px;margin:0 auto}
    275 div#content{float:left;width:[(#GET{LargeurContaineur}|plus{-#GET{LargeurMenuGauche}})]px}
    276 div#navigation{float:right;width:#GET{LargeurMenuGauche}px}
    277 div#extra{float:right;clear:right;width:#GET{LargeurMenuGauche}px}
    278 div#footer{clear:both;width:100%}
    279 @media (max-width: [(#GET{LargeurContaineur})]px) {
    280 div#wrapper{margin-left:0}
    281 div#navigation{float:left;width:50%}
    282 div#extra{float:left;width:50%;}
     274#container{width:#GET{LargeurContaineurOmbres}px;margin:0 auto}
     275#content{float:left;width:[(#GET{LargeurContaineur}|plus{-#GET{LargeurMenuGauche}})]px}
     276#navigation{float:right;width:#GET{LargeurMenuGauche}px}
     277#extra{float:right;clear:right;width:#GET{LargeurMenuGauche}px}
     278#footer{clear:both;width:100%}
     279@media (max-width: [(#GET{LargeurContaineur})]px) {
     280#wrapper{margin-left:0}
     281#navigation{float:left;width:50%}
     282#extra{float:left;width:50%;}
    283283}][(#ENV{layoutgala}|=={34}|oui)/* 34 */
    284 div#container{width:#GET{LargeurContaineurOmbres}px;margin:0 auto}
    285 div#content{float:right;width:[(#GET{LargeurContaineur}|plus{-#GET{LargeurMenuGauche}})]px}
    286 div#navigation{float:left;width:#GET{LargeurMenuGauche}px}
    287 div#extra{float:left;clear:left;width:#GET{LargeurMenuGauche}px}
    288 div#footer{clear:both;width:100%}
    289 @media (max-width: [(#GET{LargeurContaineur})]px) {
    290 div#wrapper{margin-left:0}
    291 div#content{float:none;}
    292 div#navigation{float:left;width:50%}
    293 div#extra{float:left;width:50%;clear:none;}
     284#container{width:#GET{LargeurContaineurOmbres}px;margin:0 auto}
     285#content{float:right;width:[(#GET{LargeurContaineur}|plus{-#GET{LargeurMenuGauche}})]px}
     286#navigation{float:left;width:#GET{LargeurMenuGauche}px}
     287#extra{float:left;clear:left;width:#GET{LargeurMenuGauche}px}
     288#footer{clear:both;width:100%}
     289@media (max-width: [(#GET{LargeurContaineur})]px) {
     290#wrapper{margin-left:0}
     291#content{float:none;}
     292#navigation{float:left;width:50%}
     293#extra{float:left;width:50%;clear:none;}
    294294}][(#ENV{layoutgala}|=={35}|oui)/* 35 */
    295 div#container{width:#GET{LargeurContaineurOmbres}px;margin:0 auto}
    296 div#content{float:left;width:[(#GET{LargeurContaineur}|plus{-#GET{LargeurMenuGauche}})]px}
    297 div#navigation{float:right;width:#GET{LargeurMenuGauche}px}
    298 div#extra{float:left;width:[(#GET{LargeurContaineur}|plus{-#GET{LargeurMenuGauche}})]px}
    299 div#footer{clear:both;width:100%}
    300 @media (max-width: [(#GET{LargeurContaineur})]px) {
    301 div#navigation{float:left;width:50%}
    302 div#extra{float:left;width:50%}
     295#container{width:#GET{LargeurContaineurOmbres}px;margin:0 auto}
     296#content{float:left;width:[(#GET{LargeurContaineur}|plus{-#GET{LargeurMenuGauche}})]px}
     297#navigation{float:right;width:#GET{LargeurMenuGauche}px}
     298#extra{float:left;width:[(#GET{LargeurContaineur}|plus{-#GET{LargeurMenuGauche}})]px}
     299#footer{clear:both;width:100%}
     300@media (max-width: [(#GET{LargeurContaineur})]px) {
     301#navigation{float:left;width:50%}
     302#extra{float:left;width:50%}
    303303}][(#ENV{layoutgala}|=={36}|oui)/* 36 */
    304 div#container{width:#GET{LargeurContaineurOmbres}px;margin:0 auto}
    305 div#content{float:right;width:[(#GET{LargeurContaineur}|plus{-#GET{LargeurMenuGauche}})]px}
    306 div#navigation{float:left;width:#GET{LargeurMenuGauche}px}
    307 div#extra{float:right;width:[(#GET{LargeurContaineur}|plus{-#GET{LargeurMenuGauche}})]px}
    308 div#footer{clear:both;width:100%}
    309 @media (max-width: [(#GET{LargeurContaineur})]px) {
    310 div#navigation{float:left;width:50%}
    311 div#extra{float:left;width:50%}
     304#container{width:#GET{LargeurContaineurOmbres}px;margin:0 auto}
     305#content{float:right;width:[(#GET{LargeurContaineur}|plus{-#GET{LargeurMenuGauche}})]px}
     306#navigation{float:left;width:#GET{LargeurMenuGauche}px}
     307#extra{float:right;width:[(#GET{LargeurContaineur}|plus{-#GET{LargeurMenuGauche}})]px}
     308#footer{clear:both;width:100%}
     309@media (max-width: [(#GET{LargeurContaineur})]px) {
     310#navigation{float:left;width:50%}
     311#extra{float:left;width:50%}
    312312}][(#ENV{layoutgala}|=={37}|oui)/* 37 */
    313 div#container{width:#GET{LargeurContaineurOmbres}px;margin:0 auto}
    314 div#content{float:left;width:[(#GET{LargeurContaineur}|moins{#GET{LargeurMenuGauche}})]px}
    315 div#navigation{float:right;width:#GET{LargeurMenuGauche}px}
    316 div#extra{clear:both;width:100%}
    317 @media (max-width: [(#GET{LargeurContaineur})]px) {
    318 div#wrapper{float:none; width:100%;}
    319 div#navigation{float:left;width:50%}
    320 div#extra{float:left;width:50%;clear:none;}
    321 div#footer{clear:left;width:100%}
     313#container{width:#GET{LargeurContaineurOmbres}px;margin:0 auto}
     314#content{float:left;width:[(#GET{LargeurContaineur}|moins{#GET{LargeurMenuGauche}})]px}
     315#navigation{float:right;width:#GET{LargeurMenuGauche}px}
     316#extra{clear:both;width:100%}
     317@media (max-width: [(#GET{LargeurContaineur})]px) {
     318#wrapper{float:none; width:100%;}
     319#navigation{float:left;width:50%}
     320#extra{float:left;width:50%;clear:none;}
     321#footer{clear:left;width:100%}
    322322}][(#ENV{layoutgala}|=={38}|oui)/* 38 */
    323 div#container{width:#GET{LargeurContaineurOmbres}px;margin:0 auto}
    324 div#content{float:right;width:[(#GET{LargeurContaineur}|moins{#GET{LargeurMenuGauche}})]px}
    325 div#navigation{float:left;width:#GET{LargeurMenuGauche}px}
    326 div#extra{clear:both;width:100%}
    327 @media (max-width: [(#GET{LargeurContaineur})]px) {
    328 div#wrapper{float:none; width:100%;}
    329 div#navigation{float:left;width:50%}
    330 div#extra{float:left;width:50%;clear:none;}
    331 div#footer{clear:left;width:100%}
     323#container{width:#GET{LargeurContaineurOmbres}px;margin:0 auto}
     324#content{float:right;width:[(#GET{LargeurContaineur}|moins{#GET{LargeurMenuGauche}})]px}
     325#navigation{float:left;width:#GET{LargeurMenuGauche}px}
     326#extra{clear:both;width:100%}
     327@media (max-width: [(#GET{LargeurContaineur})]px) {
     328#wrapper{float:none; width:100%;}
     329#navigation{float:left;width:50%}
     330#extra{float:left;width:50%;clear:none;}
     331#footer{clear:left;width:100%}
    332332}][(#ENV{layoutgala}|=={39}|oui)/* 39 */
    333 div#wrapper{float:left;width:100%}
    334 div#container{width:#GET{LargeurContaineurOmbres}px;margin:0 auto}
    335 div#navigation{float:left;width:50%}
    336 div#extra{float:right;width:50%}
    337 div#footer{clear:both;width:100%}
     333#wrapper{float:left;width:100%}
     334#container{width:#GET{LargeurContaineurOmbres}px;margin:0 auto}
     335#navigation{float:left;width:50%}
     336#extra{float:right;width:50%}
     337#footer{clear:both;width:100%}
    338338][(#ENV{layoutgala}|=={40}|oui)/* 40 */
    339 div#container{width:#GET{LargeurContaineurOmbres}px;margin:0 auto}
    340 div#navigation{float:right;width:50%}
    341 div#extra{float:left;width:50%}
    342 div#footer{clear:both;width:100%}
    343 @media (max-width: [(#GET{LargeurContaineur})]px) {
    344 div#navigation{float:right;width:50%}
    345 div#extra{float:left;width:50%}
     339#container{width:#GET{LargeurContaineurOmbres}px;margin:0 auto}
     340#navigation{float:right;width:50%}
     341#extra{float:left;width:50%}
     342#footer{clear:both;width:100%}
     343@media (max-width: [(#GET{LargeurContaineur})]px) {
     344#navigation{float:right;width:50%}
     345#extra{float:left;width:50%}
    346346}]
     347
     348/* Astuce trouvée sur https://stackoverflow.com/questions/1205159/html-css-making-two-floating-divs-the-same-height */
     349#contenu { overflow: hidden; }
     350#content, #navigation, #extra {
     351        padding-bottom: 500em;
     352        margin-bottom: -500em;
     353        position: relative;
     354}
     355#contenu:after {
     356  content: "";
     357  display: table;
     358  clear: both;
     359}
  • _squelettes_/soyezcreateurs_net/trunk/plugins/soyezcreateurs/noisettes/footer/footer_modeblog.html

    r105918 r106141  
    44</div><!-- id="content" -->
    55        </div><!-- id="wrapper" -->
    6         <nav><div id="navigation" class="equilibre stackable">
     6        <nav><div id="navigation">
    77[(#CONFIG{soyezcreateurs/logoheader,header}|=={navigation}|oui)#INCLURE{fond=noisettes/logosite}]
    88<div id="menu" class="navstuff">
     
    4242        </div><!-- id="navigation" --></nav>
    4343
    44         <aside><div id="extra" class="navStuff equilibre stackable laststackable">
     44        <aside><div id="extra" class="navStuff">
    4545[<div class="rightmenu">(#PLUGIN{mesfavoris}|oui)<INCLURE{fond=noisettes/extra/favoris}></div>]
    4646[(#CONFIG{soyezcreateurs/citationsheader,extra}|=={extra}|oui)<INCLURE{fond=noisettes/extra/citations}>]
  • _squelettes_/soyezcreateurs_net/trunk/plugins/soyezcreateurs/noisettes/footer/footer_modeedito.html

    r105918 r106141  
    44</div><!-- id="content" -->
    55        </div><!-- id="wrapper" -->
    6         <nav><div id="navigation" class="equilibre stackable">
     6        <nav><div id="navigation">
    77        <h1 class="nocontent offscreen">Menu de la section</h1>
    88[(#CONFIG{soyezcreateurs/logoheader,header}|=={navigation}|oui)#INCLURE{fond=noisettes/logosite}]
  • _squelettes_/soyezcreateurs_net/trunk/plugins/soyezcreateurs/noisettes/footer/footer_modeportailevenementiel.html

    r105918 r106141  
    44</div><!-- id="content" -->
    55        </div><!-- id="wrapper" -->
    6         <nav><div id="navigation" class="equilibre stackable">
     6        <nav><div id="navigation">
    77<div id="menu" class="navStuff">
    88<B_Racines>
     
    4343
    4444
    45         <aside><div id="extra" class="navStuff equilibre stackable laststackable">
     45        <aside><div id="extra" class="navStuff">
    4646<div class="rightmenu">
    4747
  • _squelettes_/soyezcreateurs_net/trunk/plugins/soyezcreateurs/noisettes/footer/footer_typerubrique_membre.html

    r105918 r106141  
    44</div><!-- id="content" -->
    55        </div><!-- id="wrapper" -->
    6         <nav><div id="navigation" class="equilibre stackable">
     6        <nav><div id="navigation">
    77[(#CONFIG{soyezcreateurs/logoheader,header}|=={navigation}|oui)#INCLURE{fond=noisettes/logosite}]
    88<div id="menu" class="navStuff">
  • _squelettes_/soyezcreateurs_net/trunk/plugins/soyezcreateurs/noisettes/header/header.html

    r105918 r106141  
    115115[<script src="(#CHEMIN{javascript/calendar/jquery.calendar.js}|timestamp)" type="text/javascript"></script>]
    116116]
    117 [<script src="(#CHEMIN{images/jquery.em.js}|timestamp)" type="text/javascript"></script>]
    118117[<script src="(#CHEMIN{javascript/jquery-accessible-modal-window-aria/jquery-accessible-modal-window-aria.js}|timestamp)" type="text/javascript"></script>]
    119118[(#ENV{idbody}|=={sommaire_mode_international}|oui)[<script src="(#CHEMIN{javascript/jquery.cycle.all.js}|timestamp)" type="text/javascript"></script>]]
    120 <script type="text/javascript">
    121 CanceladjustLayout = false;
    122 CancelMonitorTextSize = false;
    123 </script>
    124119
    125120[(#CHEMIN{noisettes/header/header_perso.html}|oui)
     
    147142<div id="contenu">
    148143        <div id="wrapper">
    149 <div id="content" class="equilibre notstackable">
     144<div id="content">
    150145[(#CONFIG{soyezcreateurs/menuhautheader,header}|=={content}|oui)<INCLURE{fond=noisettes/menus/menuhaut,secteurencours,rubriqueencours}>]
    151146#FILTRE{mini_html}
  • _squelettes_/soyezcreateurs_net/trunk/plugins/soyezcreateurs/noisettes/menus/menu_right.html

    r105918 r106141  
    1         <aside><div id="extra" class="navStuff equilibre stackable laststackable">
     1        <aside><div id="extra" class="navStuff">
    22        <h2 class="nocontent offscreen">Navigation secondaire</h2>
    33[<div class="rightmenu">(#PLUGIN{mesfavoris}|oui)<INCLURE{fond=noisettes/extra/favoris}></div>]
  • _squelettes_/soyezcreateurs_net/trunk/plugins/soyezcreateurs/noisettes/sommaire/sommaire_modecommuniquant.html

    r105918 r106141  
    44#SET{Largeurcontent_central,(#GET{LargeurContaineur}|moins{#GET{LargeurMenuGauche}}|moins{#GET{LargeurMenuDroit}})}
    55#SET{Largeurcontent_extra,(#GET{LargeurContaineur}|moins{#GET{Largeurcontent_central}})}
    6 <script type="text/javascript">
    7         CanceladjustLayout = true;
    8 </script>
    96<main id="main" role="main"><div id="communiquant_content">
    107<a id="letexte"></a>
  • _squelettes_/soyezcreateurs_net/trunk/plugins/soyezcreateurs/noisettes/sommaire/sommaire_modeinternational.html

    r92881 r106141  
    2626)]
    2727
    28 <script type="text/javascript">
    29         CancelMonitorTextSize = true;
    30 </script>
    3128#INCLURE{fond=noisettes/sommaire/inc_sommaire_modeinternational_newsticker}
    3229<div class="outerinternational">
  • _squelettes_/soyezcreateurs_net/trunk/plugins/soyezcreateurs/noisettes/sommaire/sommaire_modemairie.html

    r105918 r106141  
    55#SET{Largeurmairie_video,(#GET{Largeurmairie_central}|div{3})}
    66#SET{Largeurmairie_edito,(#GET{Largeurmairie_central}|moins{#GET{Largeurmairie_video}})}
    7 <script type="text/javascript">
    8         CanceladjustLayout = true;
    9 </script>
    107<div id="mairie_content">
    118<a id="letexte"></a>
  • _squelettes_/soyezcreateurs_net/trunk/plugins/soyezcreateurs/noisettes/sommaire/sommaire_modeportail.html

    r105918 r106141  
    1 <script type="text/javascript">
    2         CanceladjustLayout = true;
    3 </script>
    41<main id="main" role="main">
    52<div id="gauchedroite">
  • _squelettes_/soyezcreateurs_net/trunk/plugins/soyezcreateurs/noisettes/sommaire/sommaire_modeportail_pictosdroite.html

    r105918 r106141  
    11[(#REM) Pictos de droite]
    2         <nav><div id="extra" class="navStuff equilibre laststackable"><h1 class="nocontent offscreen">Menu de navigation secondaire</h1>
     2        <nav><div id="extra" class="navStuff"><h1 class="nocontent offscreen">Menu de navigation secondaire</h1>
    33<INCLURE{fond=noisettes/sommaire/sommaire_modeportail_pictos_#CONFIG{soyezcreateurs_couleurs/autovignettes,auto},pictoscherches=^[02468]\.}>
    44[(#CONFIG{soyezcreateurs/citationsheader,extra}|=={extra}|oui)<INCLURE{fond=noisettes/extra/citations}>]
  • _squelettes_/soyezcreateurs_net/trunk/plugins/soyezcreateurs/noisettes/sommaire/sommaire_modeportail_pictosgauche.html

    r105918 r106141  
    11[(#REM) Pictos de gauche]
    2         <nav id="menusite"><div id="navigation" class="equilibre stackable"><h1 class="nocontent offscreen">Menu de navigation primaire</h1>
     2        <nav id="menusite"><div id="navigation"><h1 class="nocontent offscreen">Menu de navigation primaire</h1>
    33<INCLURE{fond=noisettes/sommaire/sommaire_modeportail_pictos_#CONFIG{soyezcreateurs_couleurs/autovignettes,auto},pictoscherches=^[13579]\.}>
    44<B_Racines>
  • _squelettes_/soyezcreateurs_net/trunk/plugins/soyezcreateurs/noisettes/sommaire/sommaire_modeportailagence.html

    r105820 r106141  
    44#SET{Largeurcontent_central,(#GET{LargeurContaineur}|moins{#GET{LargeurMenuGauche}}|moins{#GET{LargeurMenuDroit}})}
    55#SET{Largeurcontent_extra,(#GET{LargeurContaineur}|moins{#GET{Largeurcontent_central}})}
    6 <script type="text/javascript">
    7         CanceladjustLayout = true;
    8 </script>
    96<main id="main" role="main"><div id="agence_content">
    107<a id="letexte"></a>
    11 
    12 
    138
    149[(#PLUGIN{SOCIALTAGS}|oui)<div id="socialtags"></div>]
    1510
    1611</div><!-- agence_content --></main>
    17 
    1812#FILTRE{mini_html}
  • _squelettes_/soyezcreateurs_net/trunk/plugins/soyezcreateurs/noisettes/sommaire/sommaire_modeportailcognac.html

    r105993 r106141  
    44#SET{Largeurcontent_central,(#GET{LargeurContaineur}|moins{#GET{LargeurMenuGauche}}|moins{#GET{LargeurMenuDroit}})}
    55#SET{Largeurcontent_extra,(#GET{LargeurContaineur}|moins{#GET{Largeurcontent_central}})}
    6 <script type="text/javascript">
    7         CanceladjustLayout = true;
    8 </script>
    96<main id="main" role="main"><div id="cognac_content">
    107<a id="letexte"></a>
  • _squelettes_/soyezcreateurs_net/trunk/plugins/soyezcreateurs/paquet.xml

    r105993 r106141  
    22        prefix="soyezcreateurs"
    33        categorie="squelette"
    4         version="4.1.6"
     4        version="4.1.7"
    55        etat="stable"
    66        compatibilite="[3.0.25;3.2.*]"
  • _squelettes_/soyezcreateurs_net/trunk/plugins/soyezcreateurs/stylescommuniquant.css.html

    r103911 r106141  
    1717#SET{Largeurcontent_extra,(#GET{LargeurContaineur}|moins{#GET{Largeurcontent_central}})}
    1818
    19 div#content { margin: 0; width:#GET{LargeurContaineur}px; }
     19div#content { width:#GET{LargeurContaineur}px; }
    2020#communiquant_content { clear: both; padding-bottom: 10px; }
    2121#communiquant_content_central {
  • _squelettes_/soyezcreateurs_net/trunk/plugins/soyezcreateurs/stylesportail.css.html

    r100036 r106141  
    2929#gauche { position: relative; float: left; padding: 0 20px; width: 50%; }
    3030
     31#sommaire_mode_portail #content, #sommaire_mode_portail #navigation, #sommaire_mode_portail #extra {
     32        padding-bottom: 0;
     33        margin-bottom: 0;
     34}
    3135#sommaire_mode_portail #navigation { float: left; margin-left: -#GET{LargeurContaineur}px; background-color: transparent; }
    32 #sommaire_mode_portail #extra { margin-left: -#GET{LargeurMenuDroit}px; background-color: transparent; }
     36#sommaire_mode_portail #extra { margin-left: -#GET{LargeurMenuDroit}px; background-color: transparent; clear: none; }
    3337
    3438dl, dd, dt { margin: 0; }
  • _squelettes_/soyezcreateurs_net/trunk/plugins/soyezcreateurs/stylesportailagence.css.html

    r105820 r106141  
    3838
    3939div#content { width: 100%; }
     40#content, #navigation, #extra { padding-bottom:0; margin-bottom:0; }
    4041
    4142
  • _squelettes_/soyezcreateurs_net/trunk/plugins/soyezcreateurs/stylesportailcognac.css.html

    r105986 r106141  
    3030#SET{c_container,(#CONFIG{soyezcreateurs_couleurs/container,#02265a})}
    3131        #SET{c_container_bk,(#CONFIG{soyezcreateurs_couleurs/container_bk,#f6f6f6})}
     32#SET{c_titraille,(#CONFIG{soyezcreateurs_couleurs/titraille,#005e7a})}
     33        #SET{c_titraille_bk,(#CONFIG{soyezcreateurs_couleurs/titraille_bk,#f6f6f6})}
    3234
    3335#SET{LargeurContaineur,(#CONFIG{soyezcreateurs_layout/largeurconteneur,960})}
     
    3941
    4042div#content { width: 100%; }
    41 
     43#content, #navigation, #extra { padding-bottom:0; margin-bottom:0; }
    4244
    4345{
     
    344346  font-size: 50px;
    345347  opacity: 1;
    346   color: #be1621;
     348  color: #GET{c_header};
    347349}
    348350.slider-pratique .slick-prev:hover:before,
     
    420422  content: "";
    421423  display: block;
    422   background-color: #be1621;
     424  background-color: #GET{c_header};
    423425  width: 100%;
    424426  height: 1px;
     
    426428#content .titre-sommaire h1 {
    427429  display: block;
    428   background-color: #eae9e5;
     430  background-color: #GET{c_header_bk};
    429431max-width: [(#GET{LargeurContaineur}|moins{44})]px;
    430432  margin: -1.1em auto 1em auto;
    431433  padding: .5em .8em .5em;
    432   color: #be1621;
     434  color: #GET{c_header};
    433435  font-size: 2rem;
    434436  line-height: 1em;
    435   border-left: 1px solid #be1621;
     437  border-left: 1px solid #GET{c_header};
    436438}
    437439@media screen and (max-width: 1178px) {
     
    470472}
    471473 .slick-dots li.slick-active button::before {
    472   color: #be1621;
     474  color: #GET{c_header};
     475  opacity: 1;
    473476}
    474477 #liens-diaporama {
     
    511514  padding: .85rem .5rem;
    512515  font-size: 0;
    513   border-left: 1px solid #be1621 ;
     516  border-left: 1px solid #GET{c_header} ;
    514517}
    515518 #liens-diaporama li a span.icon:before {
     
    538541  margin-top: 6.5em;
    539542  margin-bottom: 4em;
    540 }
    541  #pratique .titre-sommaire h1 {
    542   background-color: #CFEBEB;
    543543}
    544544 .clearfix:after,
     
    643643  width: 30px;
    644644  height: 30px;
    645 }
    646 .slick-dots li.slick-active button::before {
    647   color: black;
    648645}
    649646#content img {
     
    729726  font-size: 21px;
    730727  font-weight: 400;
    731   color: #be1621 ;
     728  color: #GET{c_header} ;
    732729  line-height: 21px;
    733730  padding: 10px;
  • _squelettes_/soyezcreateurs_net/trunk/plugins/soyezcreateurs/stylessoyezcreateurs.css.html

    r105816 r106141  
    614614
    615615/*************** STRUCTURE - CONTENT */
    616 #content { clear:both; position: relative; padding:0; margin: 0; background-color: #GET{c_container_bk};[(#CONFIG{soyezcreateurs_couleurs/transparencecontent,1}|!={1}|oui)background-color: rgba([(#GET{c_container_bk}|sc_rgb)], #CONFIG{soyezcreateurs_couleurs/transparencecontent,1});] color: #GET{c_container}; }
     616#content { clear:both; position: relative; background-color: #GET{c_container_bk};[(#CONFIG{soyezcreateurs_couleurs/transparencecontent,1}|!={1}|oui)background-color: rgba([(#GET{c_container_bk}|sc_rgb)], #CONFIG{soyezcreateurs_couleurs/transparencecontent,1});] color: #GET{c_container}; }
    617617/* Astuce : https://www.fourfront.us/blog/css-shadow-borders-with-curved-box-shadows */
    618 #content { position:relative; overflow:hidden; }
     618#contenu, #content { position:relative; overflow:hidden; }
    619619[(#CONFIG{soyezcreateurs_couleurs/ombrecontentbefore,none}!={none}|oui)
    620   #content:before {
    621   content: " ";
    622   position:absolute;
    623   z-index: 1;
    624620[(#CONFIG{soyezcreateurs_couleurs/ombrecontentbefore,none}|=={left}|oui)
     621#content:before {
    625622  top: 0;
    626623  height:100%; 
     
    629626  border-radius: 5px / 100px;
    630627]
     628[(#CONFIG{soyezcreateurs_couleurs/ombrecontentbefore,none}|=={right}|oui)
     629#content:before {
     630  top: 0;
     631  height:100%; 
     632  right: -10px;
     633  width: 10px;
     634  border-radius: 5px / 100px;
     635]
     636
    631637[(#CONFIG{soyezcreateurs_couleurs/ombrecontentbefore,none}|=={top}|oui)
     638#contenu:before {
    632639  left: 0;
    633640  width:100%; 
     
    636643  border-radius: 100px / 5px;
    637644]
    638 [(#CONFIG{soyezcreateurs_couleurs/ombrecontentbefore,none}|=={right}|oui)
     645[(#CONFIG{soyezcreateurs_couleurs/ombrecontentbefore,none}|=={bottom}|oui)
     646#contenu:before {
     647  left: 0;
     648  width:100%; 
     649  bottom: -10px;
     650  height: 10px;
     651  border-radius: 100px / 5px;
     652]
     653  content: " ";
     654  position:absolute;
     655  z-index: 1;
     656  -webkit-box-shadow: [(#CONFIG{soyezcreateurs_couleurs/ombrecontentbeforeparametres,0px 0px 13px 0px})] rgba([(#CONFIG{soyezcreateurs_couleurs/ombrecontentbeforecouleur,#000000}|sc_rgb)], #CONFIG{soyezcreateurs_couleurs/ombrecontentbeforetransparence,0.6});
     657  -moz-box-shadow: [(#CONFIG{soyezcreateurs_couleurs/ombrecontentbeforeparametres,0px 0px 13px 0px})] rgba([(#CONFIG{soyezcreateurs_couleurs/ombrecontentbeforecouleur,#000000}|sc_rgb)], #CONFIG{soyezcreateurs_couleurs/ombrecontentbeforetransparence,0.6});
     658  box-shadow: [(#CONFIG{soyezcreateurs_couleurs/ombrecontentbeforeparametres,0px 0px 13px 0px})] rgba([(#CONFIG{soyezcreateurs_couleurs/ombrecontentbeforecouleur,#000000}|sc_rgb)], #CONFIG{soyezcreateurs_couleurs/ombrecontentbeforetransparence,0.6});
     659}
     660]
     661[(#CONFIG{soyezcreateurs_couleurs/ombrecontentafter,none}!={none}|oui)
     662[(#CONFIG{soyezcreateurs_couleurs/ombrecontentafter,none}|=={left}|oui)
     663#content:after {
     664  top: 0;
     665  height:100%; 
     666  left: -10px;
     667  width: 10px;
     668  border-radius: 5px / 100px;
     669]
     670[(#CONFIG{soyezcreateurs_couleurs/ombrecontentafter,none}|=={right}|oui)
     671#content:after {
    639672  top: 0;
    640673  height:100%; 
     
    643676  border-radius: 5px / 100px;
    644677]
    645 [(#CONFIG{soyezcreateurs_couleurs/ombrecontentbefore,none}|=={bottom}|oui)
     678
     679[(#CONFIG{soyezcreateurs_couleurs/ombrecontentafter,none}|=={top}|oui)
     680#contenu:after {
     681  left: 0;
     682  width:100%; 
     683  top: -10px;
     684  height: 10px;
     685  border-radius: 100px / 5px;
     686]
     687[(#CONFIG{soyezcreateurs_couleurs/ombrecontentafter,none}|=={bottom}|oui)
     688#contenu:after {
    646689  left: 0;
    647690  width:100%; 
     
    650693  border-radius: 100px / 5px;
    651694]
    652   -webkit-box-shadow: [(#CONFIG{soyezcreateurs_couleurs/ombrecontentbeforeparametres,0px 0px 13px 0px})] rgba([(#CONFIG{soyezcreateurs_couleurs/ombrecontentbeforecouleur,#000000}|sc_rgb)], #CONFIG{soyezcreateurs_couleurs/ombrecontentbeforetransparence,0.6});
    653   -moz-box-shadow: [(#CONFIG{soyezcreateurs_couleurs/ombrecontentbeforeparametres,0px 0px 13px 0px})] rgba([(#CONFIG{soyezcreateurs_couleurs/ombrecontentbeforecouleur,#000000}|sc_rgb)], #CONFIG{soyezcreateurs_couleurs/ombrecontentbeforetransparence,0.6});
    654   box-shadow: [(#CONFIG{soyezcreateurs_couleurs/ombrecontentbeforeparametres,0px 0px 13px 0px})] rgba([(#CONFIG{soyezcreateurs_couleurs/ombrecontentbeforecouleur,#000000}|sc_rgb)], #CONFIG{soyezcreateurs_couleurs/ombrecontentbeforetransparence,0.6});
    655 }
    656 ]
    657 [(#CONFIG{soyezcreateurs_couleurs/ombrecontentafter,none}!={none}|oui)
    658   #content:after {
    659695  content: " ";
    660696  position:absolute;
    661697  z-index: 1;
    662 [(#CONFIG{soyezcreateurs_couleurs/ombrecontentafter,none}|=={left}|oui)
    663   top: 0;
    664   height:100%; 
    665   left: -10px;
    666   width: 10px;
    667   border-radius: 5px / 100px;
    668 ]
    669 [(#CONFIG{soyezcreateurs_couleurs/ombrecontentafter,none}|=={top}|oui)
    670   left: 0;
    671   width:100%; 
    672   top: -10px;
    673   height: 10px;
    674   border-radius: 100px / 5px;
    675 ]
    676 [(#CONFIG{soyezcreateurs_couleurs/ombrecontentafter,none}|=={right}|oui)
    677   top: 0;
    678   height:100%; 
    679   right: -10px;
    680   width: 10px;
    681   border-radius: 5px / 100px;
    682 ]
    683 [(#CONFIG{soyezcreateurs_couleurs/ombrecontentafter,none}|=={bottom}|oui)
    684   left: 0;
    685   width:100%; 
    686   bottom: -10px;
    687   height: 10px;
    688   border-radius: 100px / 5px;
    689 ]
    690698  -webkit-box-shadow: [(#CONFIG{soyezcreateurs_couleurs/ombrecontentafterparametres,0px 0px 13px 0px})] rgba([(#CONFIG{soyezcreateurs_couleurs/ombrecontentaftercouleur,#000000}|sc_rgb)], #CONFIG{soyezcreateurs_couleurs/ombrecontentaftertransparence,0.6});
    691699  -moz-box-shadow: [(#CONFIG{soyezcreateurs_couleurs/ombrecontentafterparametres,0px 0px 13px 0px})] rgba([(#CONFIG{soyezcreateurs_couleurs/ombrecontentaftercouleur,#000000}|sc_rgb)], #CONFIG{soyezcreateurs_couleurs/ombrecontentaftertransparence,0.6});
     
    15511559#SET{Largeurmairie_edito,(#GET{Largeurmairie_central}|moins{#GET{Largeurmairie_video}}|moins{24})}
    15521560
    1553 #sommaire_mode_mairie #content { margin:0 }
    15541561#mairie_content_left { width: #GET{LargeurMenuGauche}px; float:left; }
    15551562#mairie_content_left select { width: [(#GET{LargeurMenuGauche}|moins{30})]px; }
Note: See TracChangeset for help on using the changeset viewer.