Recherche avancée

Médias (0)

Mot : - Tags -/performance

Aucun média correspondant à vos critères n’est disponible sur le site.

Autres articles (100)

  • HTML5 audio and video support

    13 avril 2011, par

    MediaSPIP uses HTML5 video and audio tags to play multimedia files, taking advantage of the latest W3C innovations supported by modern browsers.
    The MediaSPIP player used has been created specifically for MediaSPIP and can be easily adapted to fit in with a specific theme.
    For older browsers the Flowplayer flash fallback is used.
    MediaSPIP allows for media playback on major mobile platforms with the above (...)

  • Librairies et binaires spécifiques au traitement vidéo et sonore

    31 janvier 2010, par

    Les logiciels et librairies suivantes sont utilisées par SPIPmotion d’une manière ou d’une autre.
    Binaires obligatoires FFMpeg : encodeur principal, permet de transcoder presque tous les types de fichiers vidéo et sonores dans les formats lisibles sur Internet. CF ce tutoriel pour son installation ; Oggz-tools : outils d’inspection de fichiers ogg ; Mediainfo : récupération d’informations depuis la plupart des formats vidéos et sonores ;
    Binaires complémentaires et facultatifs flvtool2 : (...)

  • La sauvegarde automatique de canaux SPIP

    1er avril 2010, par

    Dans le cadre de la mise en place d’une plateforme ouverte, il est important pour les hébergeurs de pouvoir disposer de sauvegardes assez régulières pour parer à tout problème éventuel.
    Pour réaliser cette tâche on se base sur deux plugins SPIP : Saveauto qui permet une sauvegarde régulière de la base de donnée sous la forme d’un dump mysql (utilisable dans phpmyadmin) mes_fichiers_2 qui permet de réaliser une archive au format zip des données importantes du site (les documents, les éléments (...)

Sur d’autres sites (5870)

  • Anomalie #4623 : Styles des fieldset dans l’espace privé

    18 avril 2021

    Bon stop (ou pas) !

    Il semble que les blocs fieldset ne peuvent pas parfaitement se styler seuls. Manifestement c’est assez récent que les navigateurs acceptent un display:flex; dessus par exemple.

    J’ai fait quelques tests en partant du formulaire de préférences des menus (tiens d’ailleurs ce formulaire a des div.editer sans div.editer-groupe parent (à corriger !)
    Il contient un fieldset + .editer-groupe.deux_colonnes (columns : 2)

    Ce que j’ai testé (sous macOS avec FF, Safari, Chrome & Opéra) : la formule suivante (enlever le .editer-groupe interne et le monter sur le fieldset)

    1. <span class="CodeRay"><span class="tag">fieldset</span><span class="class">.editer-groupe</span>
      2. 

    2.     <span class="tag">legend</span>
      3. 

    3.     <span class="tag">div</span><span class="class">.editer</span>
      4. 

    4.     <span class="tag">div</span><span class="class">.editer</span>
      5. 

    5.     ...
      6. 

    6. </span>
      7. 

    Télécharger

    1) Si on applique un columns: 2 sur ce fieldset,
    - Firefox & Safari : conservent le legend, passent le reste en 2 colonnes
    - Chrome & Opéra : ignorent et conservent donc un affichage 1 colonne.

    2) Si on applique un display: flex; flex-wrap: wrap sur ce fieldset
    - Tous : le legend est conservé comme tel
    - le reste passe effectivement en flex (permettant donc de mettre plusieurs .editer sur la même ligne)

    Déjà je suis étonné que Flex semble fonctionner, contrairement à ce que dit https://caniuse.com/mdn-html_elements_fieldset pour tous les Gecko. Et Edge aussi est indiqué en non fonctionnel.

    Donc du coup… je me dis que le .editer-groupe dans le fieldset à encore du sens stylistique.
    Ce qui pour le coup ne nous arrange pas forcément, mais ça évite aussi de casser un truc de plus dans cette structure html en le laissant.

    Donc du coup, on en reviendrait peut être à "fieldset.editer-section" ou "fieldset.editer-fieldset" ou "fieldset.fieldset" ou "fieldset" (sans rien)…
    J’utilise .editer-section ensuite (mais peut importe)

    A) fieldset.editer-section > div.editer-groupe

    (le plus proche de l’actuel je pense)

    1. <span class="CodeRay">  <span class="tag">div</span><span class="class">.editer-groupe</span>
      2. 

    2.       <span class="tag">div</span><span class="class">.editer</span>
      3. 

    3.       ...
      4. 

    4.   <span class="tag">fieldset</span><span class="class">.editer-section</span>
      5. 

    5.     <span class="tag">legend</span>
      6. 

    6.     <span class="tag">div</span><span class="class">.editer-groupe</span>
      7. 

    7.         <span class="tag">div</span><span class="class">.editer</span>
      8. 

    8.         ...
      9. 

    9. </span>
      10. 

    Télécharger

    B) fieldset.editer-groupe > div.editer-section

    L’autre possibilité si ça facilite vraiment le css, c’est d’inverser les classes (avec l’ennui principal de du coup devoir reprendre l’existant)

    1. <span class="CodeRay">  <span class="tag">div</span><span class="class">.editer-groupe</span>
      2. 

    2.       <span class="tag">div</span><span class="class">.editer</span>
      3. 

    3.       ...
      4. 

    4.   <span class="tag">fieldset</span><span class="class">.editer-groupe</span>
      5. 

    5.     <span class="tag">legend</span>
      6. 

    6.     <span class="tag">div</span><span class="class">.editer-fieldset</span>
      7. 

    7.         <span class="tag">div</span><span class="class">.editer</span>
      8. 

    8.         ...
      9. 

    9. </span>
      10. 

    Télécharger

    B) fieldset.editer-groupe.editer-section > div.editer-groupe

    Ou du doubler d’une autre classe

    1. <span class="CodeRay">  <span class="tag">div</span><span class="class">.editer-groupe</span>
      2. 

    2.       <span class="tag">div</span><span class="class">.editer</span>
      3. 

    3.       ...
      4. 

    4.   <span class="tag">fieldset</span><span class="class">.editer-groupe</span><span class="class">.editer-section</span>
      5. 

    5.     <span class="tag">legend</span>
      6. 

    6.     <span class="tag">div</span><span class="class">.editer-groupe</span>
      7. 

    7.         <span class="tag">div</span><span class="class">.editer</span>
      8. 

    8.         ...
      9. 

    9. </span>
      10. 

    Télécharger

    Mais dans ce cas là je trouve cela redondant (fieldset.editer-section me parait suffisant, si on doit effectivement mettre un classe css dessus)
    Le plus ennuyant est peut être de devoir annuler des styles CSS du .editer-groupe dans .editer-section > .editer-groupe ;

  • Anomalie #4623 : Styles des fieldset dans l’espace privé

    18 avril 2021

    Dans quelle mesure Tcharles il y a besoin du .editer-groupe dans le fieldset.editer-surgroupe ?

    Et bien écoute, maintenant que tu le dis, je ne sais pas :)
    La sémantique de la balise fieldset et de la classe .editer-groupe est finalement la même oui, ton exemple semble plus logique.
    Des fois même si c’est pas bien, on n’a pas d’autre choix que de rajouter un conteneur pour faciliter ou permettre des choix stylistiques, mais là ça semble pas nécessaire.

    Je serais incliné à ajouter une classe complémentaire sur les fieldset.editer-groupe quand même, pour distinguer les « groupes avec légende » des « groupes lambdas ». Dans les CSS on peut certes se reposer sur la balise, mais ça simplifierait et serait un peu plus propre. Une déclinaison de .editer-groupe plus sémantique pour dire que c’est une variante ? Je mets « editer-groupe-xxx » dans l’exemple pour l’instant. Sinon la bonne vieille classe .fieldset.

    1. <span class="CodeRay"><span class="tag">form</span>
      2. 

    2.   <span class="tag">div</span><span class="class">.editer-groupe</span>
      3. 

    3.     <span class="tag">div</span><span class="class">.editer</span>
      4. 

    4.     <span class="tag">div</span><span class="class">.editer</span>
      5. 

    5.     ...
      6. 

    6.  
      7. 

    7.   <span class="tag">fieldset</span><span class="class">.editer-groupe</span><span class="class">.editer-groupe-xxx</span>
      8. 

    8.     <span class="tag">legend</span>
      9. 

    9.     <span class="tag">div</span><span class="class">.editer</span>
      10. 

    10.     <span class="tag">div</span><span class="class">.editer</span>
      11. 

    11.  
      12. 

    12.   <span class="tag">div</span><span class="class">.editer-groupe</span>
      13. 

    13.     <span class="tag">div</span><span class="class">.editer</span>
      14. 

    14.     <span class="tag">fieldset</span><span class="class">.editer</span>
      15. 

    15.       <span class="class">.choix</span> 
      16. 

    16.     <span class="tag">fieldset</span><span class="class">.editer-groupe</span><span class="class">.editer-groupe-xxx</span>
      17. 

    17.        <span class="tag">legend</span>
      18. 

    18.        <span class="tag">div</span><span class="class">.editer</span>
      19. 

    19.        <span class="tag">div</span><span class="class">.editer</span>
      20. 

    20. </span>
      21. 

    Télécharger

  • Anomalie #4623 : Styles des fieldset dans l’espace privé

    18 avril 2021

    Je découvre les fieldset.editer qui sont des lignes pour les .choix, introduit assez récemment. Donc ça fait une option de plus à gérer.

    Dans quelle mesure Tcharles il y a besoin du .editer-groupe dans le fieldset.editer-surgroupe ? Est-ce que ça pourrait servir pour passer les champs .editer dedans en colonne (flexbox horizontal ?) sur certains fieldset ? (Je suppose qu’on en aurait pas besoin pour ça). Et donc que ça simplifierait si on met directement fieldset.editer-groupe

    1. <span class="CodeRay"><span class="tag">form</span>
      2. 

    2.   <span class="tag">div</span><span class="class">.editer-groupe</span>
      3. 

    3.     <span class="tag">div</span><span class="class">.editer</span>
      4. 

    4.     <span class="tag">div</span><span class="class">.editer</span>
      5. 

    5.     ...
      6. 

    6.  
      7. 

    7.   <span class="tag">fieldset</span><span class="class">.editer-groupe</span>
      8. 

    8.     <span class="tag">legend</span>
      9. 

    9.     <span class="tag">div</span><span class="class">.editer</span>
      10. 

    10.     <span class="tag">div</span><span class="class">.editer</span>
      11. 

    11.  
      12. 

    12.   <span class="tag">div</span><span class="class">.editer-groupe</span>
      13. 

    13.     <span class="tag">div</span><span class="class">.editer</span>
      14. 

    14.     <span class="tag">fieldset</span><span class="class">.editer</span>
      15. 

    15.       <span class="class">.choix</span> 
      16. 

    16.     <span class="tag">fieldset</span><span class="class">.editer-groupe</span>
      17. 

    17.        <span class="tag">legend</span>
      18. 

    18.        <span class="tag">div</span><span class="class">.editer</span>
      19. 

    19.        <span class="tag">div</span><span class="class">.editer</span>
      20. 

    20.        <span class="tag">fieldset</span><span class="class">.editer-groupe</span>
      21. 

    21.           <span class="tag">legend</span>
      22. 

    22.           <span class="tag">div</span><span class="class">.editer</span>
      23. 

    23.           ...
      24. 

    24.  
      25. 

    25.   <span class="tag">fieldset</span><span class="class">.editer-groupe</span>
      26. 

    26.     <span class="tag">legend</span>
      27. 

    27.     <span class="tag">div</span><span class="class">.editer</span>
      28. 

    28.     <span class="tag">fieldset</span><span class="class">.editer-groupe</span>
      29. 

    29.        <span class="tag">legend</span>
      30. 

    30.        <span class="tag">div</span><span class="class">.editer</span>
      31. 

    31.        ...
      32. 

    32.  
      33. 

    33. </span>
      34. 

    Télécharger

    Il me semble que dans ce cas on peut toujours différencier
    - un form fieldset.editer-goupe (racine) (du moins avec style minimums = div.editer-groupe)
    - d’un form .editer-groupe fieldset.editer-groupe (mélangé avec d’autres champs = style plus élaborés avec indentation)

    En fait ça me parait assez cohérent de dire "Un fieldset c’est un groupe d’édition" (.editer-groupe) la seule grosse différence est la présence du legend. (et éventuellement de la démarcation / indentation)

Navigation