Module personnalisé probleme css et espace superieur et inferieur trop grands

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

  • [RÉGLÉ] Module personnalisé probleme css et espace superieur et inferieur trop grands

    Bonjour

    J'ai deux souci, j'ai créer un module personnalisé contenant du code assez simple (voir ci dessous). Mon premier souci est que le css que j'ai intégré n'est pas pris en compte, mes logo ce retrouvent au dessus de mes compteurs sociaux alors qu'ils devraient être alignés. (j'utilise JCE et le css est activé) Pourquoi le css n'est pas pris en compte ?

    second souci, j'ai des espaces énormes en haut et en bas de mon module, ce qui fait que l'affichage dans la colonne est très moche, y a t'il une solution pour minimiser les espaces sans toucher au css du template ?

    Merci d'avance

    mon code
    Code:
     <style type="text/css">
    div#facebookbox {
    		margin-top: 10px;
    		margin-left: 0px;
    	}
    div#like {
    		margin-top: -27px;
    		margin-left: 50px;
    	}
    div#facebooklogo {
    		margin-top: 0px;
    		margin-left: 0px;
    	}
    div#twitterbox {
    		margin-top: 0px;
    		margin-left: 0px;
    	}
    div#follow {
    		margin-top: -27px;
    		margin-left: 50px;
    	}
    div#twitterlogo {
    		margin-top: 0px;
    		margin-left: 0px;
    	}
    </style>
    
    <div id="twitterbox">
    <div id="twitterlogo">
    <a target="_blank" rel="nofollow" href="https://twitter.com/Fun_Zen">
    <img src="http://www.funzen.net/images/Twitter-Fun&zen.png" width="45" height="38"></a>
    </div>
    <div id="follow">
    <a href="https://twitter.com/fun_zen" class="twitter-follow-button" data-show-count="true" data-lang="fr" data-show-screen-name="false">Suivre @Fun_Zen</a>
    <script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+'://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js,fjs);}}(document, 'script', 'twitter-wjs');</script>
    </div>
    </div>
    
    <div id="facebookbox">
    <div id="facebooklogo">
    <a target="_blank" rel="nofollow" href="http://www.facebook.com/PageFunZen">
    <img src="http://www.funzen.net/images/Facebook-Fun&Zen.png" width="45" height="38"></a>
    </div>
    <div id="like">
    <iframe scrolling="no" frameborder="0" allowtransparency="true" "
    style="border:none; overflow:hidden; width:150px; height:20px;" 
    src="http://www.facebook.com/plugins/like.php?href=http%3A%2F%2Fwww.facebook.com%2FPageFunZen&send=false&layout=button_count&width=150&show_faces=false&action=like&colorscheme=light&font&height=20&appId=189119287889496">
    </div>
    </div>
    Dernière édition par sephirothff à 09/06/2013, 17h31

  • #2
    Re : Module personnalisé probleme css et espace superieur et inferieur trop grands

    Sans voir le code en situation, difficile de prévoir les effets de bord.
    Il vaut mieux un code plus simple de ce genre
    Code HTML:
    <div id="twitterbox">
        <span style="position:relative; bottom: -10px;">
            <a target="_blank" rel="nofollow" href="https://twitter.com/Fun_Zen">
            <img src="http://www.funzen.net/images/Twitter-Fun&zen.png" width="45" height="38"></a>
        </span>
        <a href="https://twitter.com/fun_zen" class="twitter-follow-button" data-show-count="true" data-lang="fr" data-show-screen-name="false">Suivre @Fun_Zen</a>
        <script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+'://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js,fjs);}}(document, 'script', 'twitter-wjs');</script>
    </div>
    
    <div id="facebookbox">
        <span style="position:relative; bottom: -10px;">
            <a target="_blank" rel="nofollow" href="http://www.facebook.com/PageFunZen">
            <img src="http://www.funzen.net/images/Facebook-Fun&Zen.png" width="45" height="38"></a>
        </span>
        <iframe scrolling="no" frameborder="0" allowtransparency="true" "
        style="border:none; overflow:hidden; width:150px; height:20px;" 
        src="http://www.facebook.com/plugins/like.php?href=http%3A%2F%2Fwww.facebook.com%2FPageFunZen&send=false&layout=button_count&width=150&show_faces=false&action=like&colorscheme=light&font&height=20&appId=189119287889496">
    </div>
    UP, le plugin universel à découvrir sur https//up.lomart.fr
    bgMax
    , AdminOrder, MetaData, Zoom, ArtPlug, Custom, Memo, Filter, ... sur http://lomart.fr/extensions

    Commentaire


    • #3
      Re : Module personnalisé probleme css et espace superieur et inferieur trop grands

      effectivement avec des span c'est plus simple, le code passe mieux.
      j'ai ajouté un margin-top a -30px pour remonter le tout , mais j'ai quand meme du modifier le css de mon template pour pouvoir enlever l'écart du haut sur mon cadre, c'est pas super propre mais ca fera l'affaire

      merci beaucoup

      Commentaire

      Annonce

      Réduire
      Aucune annonce pour le moment.

      Partenaire de l'association

      Réduire

      Hébergeur Web PlanetHoster
      Travaille ...
      X