Bord arrondi

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

  • Bord arrondi

    je voudrais que mes articles soient integrés dans une cellule avec des bords arrondis or plusieurs probleme se posent :

    Quel partie du css du template dois-je modifier ?
    En effectuant une recherche sur le forum je me suis presque perdu tellement il y a de liens Si quelqu'un pouvait me donner une solution qu'il a utilisé et qui fonctionne. Je sais que c'est faisable avec des balises a ajouter dans le template mais d'apres ce que j'ai lu c'est assez compliqué comme modif. Ce qui m'aurait interesse ce sont avec le css. Voila je crois que j'ai tout dis. Je voudrais garder le fond blanc ( interieur et exterieur ) et avoir juste une cellule avec une ligne noir comme contour.
    Merci

    je sais que c'est possible pour les traits avec 'dotted, solid etc... mais les angles ?? )

  • #2
    les angles ne sont pas codés en css.
    Soit tu fais la technique des images de fond soit tu utilises un javascript.

    cf rechercher
    cours de SVT - infos scientifiques : www.nicolas-ogier.fr
    pas de demandes d'aide par mp, elles seront systématiquement refusées !

    Commentaire


    • #3
      Bonsoir,
      Pour encadrer la zone des articles, avec des bords arrondis ET sans images :

      Mettre quelque chose comme ça dans l'index:

      <div id="contenu">
      <b class="bordure_top"><b class="boite_un"></b><b class="boite_deux"></b><b class="boite_trois"></b><b class="boite_4"></b></b>
      <div class="boite_des_articles">
      <?php mosMainBody(); ?>
      </div>
      <b class="bordure_bottom"><b class="boite_4"></b><b class="boite_trois"></b><b class="boite_deux"></b><b class="boite_un"></b></b>
      </div>

      Puis dans la feuille de style :

      .bordure_top, .bordure_bottom {
      display:block;
      background:transparent;
      font-size:1px;
      }
      .boite_un, .boite_deux, .boite_trois, .boite_4 {
      display:block;
      overflow:hidden;
      }
      .boite_un, .boite_deux, .boite_trois {
      height:1px;
      }
      .boite_deux, .boite_trois, .boite_4 {
      background:#fff;
      border-left:1px solid #000;
      border-right:1px solid #000;
      }
      .boite_un {
      margin:0 5px;
      background:#000;
      }
      .boite_deux {
      margin:0 3px;
      border-width:0 2px;
      }
      .boite_trois {
      margin:0 2px;
      }
      .boite_4 {
      height:2px;
      margin:0 1px;
      }

      .boite_des_articles {
      display:block;
      background:#fff;
      padding: 0 5px;
      border:0 solid #000;
      border-width:0 1px;
      }


      On se sert de la balise b pour générer une boite en ligne sans retour à la ligne.
      Les boites un à quatre servent à donner une illusion d'arrondi en faisant un affichage décalé de un ou deux pixels ( en largeur Et en hauteur ). Si on veut un arrondi plus grand, il faut augmenter le nombre de boites et procéder aux décalages adéquats.
      div id="contenu", c'est la zone que vous voulez encadrer sur le template, ici les articles et donc la mainbody.
      div class="boite_des_articles" c'est la boite des articles proprement dite (utile pour mettre un peu de padding, une autre couleur, ce qui vous chante )

      Code testé

      Espérant etre utile

      Didier

      Commentaire


      • #4
        Merci ca fonctionne tres bien

        Mais car il y a toujours un mais je voudrais que chaque articles soient entouré et pas tout le mosMainBody sinon c'est trop fort...Merci

        Commentaire


        • #5
          A mon avis, on peut le faire en bidouillant le code d'affichage des articles --> méthode bourrin
          ou, il me vient l'idée en meme temps que j'écris, en insérant une partie du code dans l'article lui meme. A savoir les balises b et la class="boite_des_articles" puis ton article puis on ferme. Je n'ai pas le temps de tester tout de suite mais je ne vois pas pourquoi ça ne fonctionnerait pas puisque les articles c'est du texte avec du html pour mettre en forme. Bien sur le css va dans le css du template.

          Didier

          Commentaire


          • #6
            Ah ben non cela ne fonctionne pas;
            autre piste alors, faire un tableau avec des cellules dans lesquelles on va mettre les images des coins arrondis et les bordures, puis au centre on met l'article.
            a l'ancienne

            Didier

            Commentaire


            • #7
              plus simple : tu peux utiliser un paramètre optionnel de mosLoadModules ($position, $style).

              Il y a un tutorial en anglais très bien fait sur ce site.

              Commentaire


              • #8
                Mais avec
                .componenttheading
                ou les autres balises pour les parametres des pages du contenu ? Enfin je sais pas de trop !!!

                Commentaire


                • #9
                  Bonsoir,
                  @ Pangel : cela sert aux modules, j'avais d'ailleurs fait un mini tuto a ce sujet : http://forum.joomla.fr/showpost.php?p=42862&postcount=3
                  Cela ne s'applique pas aux articles.

                  @ Yatoula : les articles utilisent la classe blog et contentpaneopen ( et contentheading pour le titre, etc, etc ). Peut etre creuser à partir de là.
                  J'y réfléchis.

                  didier

                  Commentaire


                  • #10
                    il y a un truc qui colle pas

                    .boite_un { }
                    .boite_deux { }
                    .boite_trois { }
                    .boite_4 { }
                    Le petit dernier est pas comme les autres.
                    Ca marche pas ça !

                    Papounet

                    PS : C'est bon, je sort...
                    I'am happy for you !
                    Dernière réalisation : http://www.pierrickservais.com/

                    Commentaire


                    • #11
                      Ben bizarre ca marche !! aide-joomla.info Dis papounet tu as pas une idée pour mon probleme sans utiliser les images ? vu que ca marche tu ne sais pas comment je peux l'integre a chaques articles ?

                      Commentaire


                      • #12
                        Envoyé par papounet
                        Le petit dernier est pas comme les autres.
                        Ca marche pas ça !

                        Papounet

                        PS : C'est bon, je sort...
                        C'est que je suis trop fainéant, quatre ça faissait trop de lettres à taper

                        Je sors aussi.......

                        Didier

                        Commentaire


                        • #13
                          Ben ca ne me fait pas avancer beaucoup ca ? Merci quand même.Je vais continuer de chercher

                          Commentaire


                          • #14
                            Salut,

                            bon je reviens avec une bonne nouvelle, j'ai trouvé.
                            Cela se passe dans content.html.php du dossier com_content.

                            Je mets le fichier modifié en PJ.
                            J'ai utilisé la meme technique que précédemment, donc on garde les styles.
                            Le balisage est identique, simplement il encadre uniquement l'article.
                            Le code est commenté dans le fichier joint.

                            Didier
                            Fichiers joints

                            Commentaire


                            • #15
                              Trop fort le mec

                              Alors là je dis bravo
                              Trop fort je vais essayer maintenant de comprendre comment tu as fait. D'analyser la chose et la

                              Merci encore super sympa. (PS: si tu as le temps ca ne te dirai pas de me faire un petit tuto vite fait sur le principe, avec un angle et une droite)

                              Commentaire

                              Annonce

                              Réduire
                              1 sur 2 < >

                              C'est [Réglé] et on n'en parle plus ?

                              A quoi ça sert ?
                              La mention [Réglé] permet aux visiteurs d'identifier rapidement les messages qui ont trouvé une solution.

                              Merci donc d'utiliser cette fonctionnalité afin de faciliter la navigation et la recherche d'informations de tous sur le forum.

                              Si vous deviez oublier de porter cette mention, nous nous permettrons de le faire à votre place... mais seulement une fois
                              Comment ajouter la mention [Réglé] à votre discussion ?
                              1 - Aller sur votre discussion et éditer votre premier message :


                              2 - Cliquer sur la liste déroulante Préfixe.

                              3 - Choisir le préfixe [Réglé].


                              4 - Et voilà… votre discussion est désormais identifiée comme réglée.

                              2 sur 2 < >

                              Assistance au forum - Outil de publication d'infos de votre site

                              Compatibilité: PHP 4.1,PHP4, 5, 6DEV MySQL 3.2 - 5.5 MySQLi from 4.1 ( @ >=PHP 4.4.9)

                              Support Version de Joomla! : | J!3.0 | J!2.5.xx | J!1.7.xx | J!1.6.xx | J1.5.xx | J!1.0.xx |

                              Version française (FR) D'autres versions sont disponibles depuis la version originale de FPA

                              UTILISER À VOS PROPRES RISQUES :
                              L'exactitude et l'exhaustivité de ce script ainsi que la documentation ne sont pas garanties et aucune responsabilité ne sera acceptée pour tout dommage, questions ou confusion provoquée par l'utilisation de ce script.

                              Problèmes connus :
                              FPA n'est actuellement pas compatible avec des sites Joomla qui ont eu leur fichier configuration.php déplacé en dehors du répertoire public_html.

                              Installation :

                              1. Téléchargez l'archive souhaitée : http://afuj.github.io/FPA/

                              Archive zip : https://github.com/AFUJ/FPA/zipball/master

                              2. Décompressez le fichier de package téléchargé sur votre propre ordinateur (à l'aide de WinZip ou d'un outil de décompression natif).

                              3. Lisez le fichier LISEZMOI inclus pour toutes les notes de versions spécifiques.

                              4. LIRE le fichier de documentation inclus pour obtenir des instructions d'utilisation détaillées.

                              5. Téléchargez le script fpa-fr.php à la racine de votre site Joomla!. C'est l'endroit que vous avez installé Joomla et ce n'est pas la racine principale de votre serveur. Voir les exemples ci-dessous.

                              6. Exécutez le script via votre navigateur en tapant: http:// www. votresite .com/ fpa-fr.php
                              et remplacer www. votresite .com par votre nom de domaine


                              Exemples:
                              Joomla! est installé dans votre répertoire web et vous avez installé la version française du fichier FPA:
                              Télécharger le script fpa-fr.php dans: /public_html/
                              Pour executer le script: http://www..com/fpa-fr.php

                              Joomla! est installé dans un sous-répertoire nommé "cms" et vous avez installé la version française du fichier FPA:
                              Télécharger le script fpa-fr.php dans: /public_html/cms/
                              Pour executer le script: http://www..com/cms/fpa-fr.php

                              En raison de la nature très sensible de l'information affichée par le script FPA, il doit être retiré immédiatement du serveur après son utilisation.

                              Pour supprimer le script de votre site, utilisez le lien de script de suppression fourni en haut de la page du script. Si le lien de suppression échoue pour supprimer le script, utilisez votre programme FTP pour le supprimer manuellement ou changer le nom une fois que le script a généré les données du site et le message publié sur le forum. Si le script est toujours présent sur le site, il peut être utilisé pour recueillir suffisamment d'informations pour pirater votre site. Le retrait du script empêche des étrangers de l'utiliser pour jeter un oeil à la façon dont votre site est structuré et de détecter les défauts qui peuvent être utilisé à vos dépends.
                              Voir plus
                              Voir moins
                              Travaille ...
                              X