Le texte en colonnes

Réduire
X
 
  • Filtrer
  • Heure
  • Afficher
Tout effacer
nouveaux messages

  • sincalor
    a répondu
    Re : Le texte en colonnes

    Résolu.
    Merci.

    Marc

    Laisser un commentaire:


  • XdiZ
    a répondu
    Re : Le texte en colonnes

    Attention, ce que j'appelle les préfixes sont : -webkit, -moz, -ms, et -o.

    Vous devez mettre le column-span dans votre id "colonne" :

    Code HTML:
    #colonne {
    -webkit-column-span: all; /* Safari & Chrome */
    -moz-column-span: all; /* Firefox */
    -ms-column-span: all; /* Internet Explorer */
    -o-column-span: all; /* Opera */
      -moz-column-count: 2;
      -webkit-column-count: 2;
      column-count: 2;
      -moz-column-rule: medium solid #993300;
      -webkit-column-rule: medium solid #993300;
      column-rule: medium solid #993300;
      -moz-column-gap: 40px;
      -webkit-column-gap: 40px;
      column-gap: 40px;
    }
    Si c'est résolu pour vous, pensez à mettre en [REGLE]

    Laisser un commentaire:


  • sincalor
    a répondu
    Re : Le texte en colonnes

    Effectivement, je viens de voir ça sur IE 8 tournant sous Windows 7, la mise en page, sans être en colonne, ne bousille pas tout quand même. C'est propre, mais sans colonne.
    Je n'ai pas pu installer IE 10 car ma version de Windows émulée n'est pas suffisante. J'ai Windows 7 Edition Starter, il me faudrait Windows 7 Pack 1, c'est ballot ! mais je ne vais pas mettre 120 € dans Windows juste pour tester IE, je n'ai même pas la dernière version de Mac OS, il faudra que j'aille faire mes tests chez quelqu'un d'autre.
    Ces préfixes que vous m'indiquez, je ne sais pas les utiliser. Je les place où ?
    Je les ai mis dans la définition de la classe dans le fichier CSS…
    (Bien sûr, ça ne change rien pour IE qui est en version 8)

    Merci XdiZ

    Marc

    Laisser un commentaire:


  • XdiZ
    a répondu
    Re : Le texte en colonnes

    Sur Mac vous pouvez virtualiser Windows et du coup tester IE 8, 9, 10 etc...

    D'après ce site, il faut utiliser des préfixes :
    Code HTML:
    column-span: all; /* W3C */
    -webkit-column-span: all; /* Safari & Chrome */
    -moz-column-span: all; /* Firefox */
    -ms-column-span: all; /* Internet Explorer */
    -o-column-span: all; /* Opera */
    Si IE n'arrive pas à afficher en colonne, il affichera tout sur une colonne, donc l'article sera linéaire, mais lisible.

    Laisser un commentaire:


  • sincalor
    a répondu
    Re : Le texte en colonnes

    Bien reçu, je vais y veiller.

    Je m'aperçois que mon dernier post n'est pas passé, le voici :

    Ça marche très bien pour Firefox, Safari, Opéra, Chrome mais je n'ai pas testé Internet Explorer car je suis sur Mac et IE n'est plus développé pour Mac.
    Comment faire pour shunter l'appel de la classe pour IE < 10 ?
    Et pour, le cas échéant, éviter de présenter une mise en page tout en l'air ?

    Merci.

    Marc

    Laisser un commentaire:


  • XdiZ
    a répondu
    Re : Le texte en colonnes

    Très bien

    Attention à BlueGriffon car il génère du code sale comme
    Code:
    mso-bidi-font-size:10.0pt
    mso-spacerun:yes
    <o:p>
    Ces attributs et balises n'existent pas en HTML.

    Donc, il faut penser à nettoyer le code manuellement ou en utilisant la petite balayette et/ou gomme de JCE.

    Laisser un commentaire:


  • sincalor
    a répondu
    Re : Le texte en colonnes

    Merci Xdiz,

    J'ai fait comme vous avez dit, et tout marche au poil.
    C'est-à-dire, pour ceux que ça intéresse (et en détail car je suis débutant) :
    J'ai écrit ma classe dans le fichier template.css de mon template, j'ai donc rajouté, à la suite de tous les styles et classes :
    Code:
     
    #colonne {
      -moz-column-count: 2;
      -webkit-column-count: 2;
      column-count: 2;
      -moz-column-rule: medium solid #993300;
      -webkit-column-rule: medium solid #993300;
      column-rule: medium solid #993300;
      -moz-column-gap: 40px;
      -webkit-column-gap: 40px;
      column-gap: 40px;
    }
    Puis, dans mon article, je suis passé en mode code (car je ne trouve pas le bouton "insérer un div" dans l'éditeur JCE), et j'ai créé un div avec la bonne classe, comme ceci :
    Code:
    <div id="colonne">
    et j'y ai collé le code suivant :
    Code:
    <p><span style="font-size:10.0pt;mso-bidi-font-size:10.0pt"><span style="mso-spacerun:yes">
    </span>blablabla… <o:p></o:p></span></p>
    <p> </p>
    <p><span style="font-size:10.0pt;mso-bidi-font-size:10.0pt"><span style="mso-spacerun:yes">
    </span>blabla blablabla…<o:p></o:p></span></p>
    <p> </p>
    Puis j'ai fermé la balise div, bien sûr.

    Je me suis aidé, dans cette tache, de Bluegriffon™, un éditeur wisiwig HTML5-CSS3 (gratuit, en français et pour toutes les plateformes) que l'on peut trouver ici (même si la page est en anglais, le logiciel à installer sur son ordi tourne en français) :
    The owner of this domain has not yet uploaded their website.

    Il suffit de faire écrire le code par Bluegriffon et de le coller dans le code de l'article en soustrayant le doctype, le head et la balise body.

    Pour vous servir !

    Marc

    Laisser un commentaire:


  • XdiZ
    a répondu
    Re : Le texte en colonnes

    Bonjour,

    Si votre template vous le permet (donc à vérifier auprès du site où vous avez téléchargé le template), vous pouvez affecter des class CSS à vos balises DIV ou P contenant votre texte.

    Si votre template ne gère pas le multicolonne de contenu, vous devez rajouter dans les fichiers CSS de votre template, les informations fournit dans l'article de DesignShack.

    Par contre le CSS Column n'est pas reconnu par IE < 10 (http://fmbip.com/litmus/ et chercher CTRL+F "CSS Column").

    Je vous invite à lire ces 2 articles :
    - http://www.alsacreations.com/tuto/li...nes-float.html
    - http://www.pompage.net/traduction/colonnesfactices

    Cordialement.

    Laisser un commentaire:


  • sincalor
    a crée un sujet [RÉGLÉ] Le texte en colonnes

    Le texte en colonnes

    Bonjour

    Version de Joomla : 2.5.9
    Template utilisé : A4joomla-sunset-free
    Extensions installées : Éditeur JCE, Maximenu, Kunena
    Hébergeur : Amen (pas encore en ligne
    Serveur : dédié ou mutualisé ou virtualisé ?
    En local

    Niveau : débutant

    Je voudrais présenter le texte de mes articles en colonnes, comme ici :

    Je parle donc de vrai colonnes, où le texte s'écoule d'une colonne à l'autre, comme dans un journal, pas de div ni de table.
    JCE ne me propose pas ça.
    Y a-t-il un moyen ? J'espère qu'il ne me faudra pas changer de template pour ça.

    Merci, c'est important.

    Marc

Annonce

Réduire
Aucune annonce pour le moment.

Partenaire de l'association

Réduire

Hébergeur Web PlanetHoster
Travaille ...
X