header en fond et couleur interieur du cadre de forum

2 participants

Forum gratuit : Le forum des forums actifs :: Entraide & Support... :: Gérer l'apparence de son forum :: Archives des problèmes avec l'apparence du forum

Voir le sujet précédent Voir le sujet suivant Aller en bas

Résolu header en fond et couleur interieur du cadre de forum

Message par kiarie Lun 6 Jan 2014 - 15:52

Bonjour a tous!

Déjà je m'excuse pour mon titre plus ou moins explicite a mon soucis mais je ne savais pas trop comment expliquer mon soucis en une phrase... >.<

Enfin sinon mon problème est que je travail actuellement sur la prochaine version de mon forum et que pour celle ci j'ai décidé de mettre un header en fond de page. Voir ici mon forum teste > http://seattle-university.forumactif.info <

Pour réussir cela je me suis servit d'un tuto trouvé sur ce forum et comme dit dans celui ci j'ai du enlever la "Couleur intérieure du cadre du forum" car sinon un cadre de la couleur du fond apparaissait sur mon header.

Sauf que au final j'aimerais tout de même avoir un cadre qui entour mon forum car je trouve que cela fait vide sans. Je pensais que cela n'était pas possible jusqu'à se que je tombe sur ce forum > http://misguidedghosts.forumactif.org < qui en plus a un super cadre avec plusieurs couleurs.

Donc voila pur conclure ma question c'est ça, comment mettre un cadre autour de mon forum sans qu'un gros bloc apparaisse sur mon header?

Merci d'avance pour vos réponses!


Dernière édition par kiarie le Mar 7 Jan 2014 - 10:31, édité 2 fois
kiarie

kiarie
****

Féminin
Messages : 281
Inscrit(e) le : 16/07/2004

http://www.life-in-ny.com
kiarie a été remercié(e) par l'auteur de ce sujet.

Résolu Re: header en fond et couleur interieur du cadre de forum

Message par [Nihil] Lun 6 Jan 2014 - 17:46

La personne a modifié ses template de telles manières à ce que le logo soit sorti du cadre intérieur du forum ^^. Il faut toucher à overall_header.
[Nihil]

[Nihil]
Membre habitué

Messages : 1215
Inscrit(e) le : 10/12/2009

https://forum.forumactif.com
[Nihil] a été remercié(e) par l'auteur de ce sujet.

Résolu Re: header en fond et couleur interieur du cadre de forum

Message par kiarie Lun 6 Jan 2014 - 18:23

Oui c'est ce que je me suis dis mais autant je sait très bien suivre les consignes pour recherche des codes, les modifier avec les nouveau donné mais voila mes compétences s'arrête a reproduire se que l'on me donne du coup si quelqu'un aurait le code et les indications qu'il me faut je lui en serait d'une grande reconnaissance^^
kiarie

kiarie
****

Féminin
Messages : 281
Inscrit(e) le : 16/07/2004

http://www.life-in-ny.com
kiarie a été remercié(e) par l'auteur de ce sujet.

Résolu Re: header en fond et couleur interieur du cadre de forum

Message par [Nihil] Lun 6 Jan 2014 - 18:27

As tu déjà modifié ce template ?
Si oui pourrais tu me le copier / coller ?

J'avais déjà vu un tuto sur comment faire cela, mais je ne le trouve plus ><
[Nihil]

[Nihil]
Membre habitué

Messages : 1215
Inscrit(e) le : 10/12/2009

https://forum.forumactif.com
[Nihil] a été remercié(e) par l'auteur de ce sujet.

Résolu Re: header en fond et couleur interieur du cadre de forum

Message par kiarie Lun 6 Jan 2014 - 18:39

Oui il est modifié après je ne sais plus se qu'il modifi x)

Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" dir="{S_CONTENT_DIRECTION}" id="min-width" lang="{L_LANG_HTML}" xml:lang="{L_LANG_HTML}" {NAMESPACE_FB_LIKE} {NAMESPACE_FB} {NAMESPACE_BBCODE}>
<head>
<link href='http://fonts.googleapis.com/css?family=Coming+Soon' rel='stylesheet' type='text/css'>
   <title>{SITENAME_TITLE}{PAGE_TITLE}</title>
   <meta http-equiv="content-type" content="text/html; charset={S_CONTENT_ENCODING}" />
   <meta http-equiv="content-script-type" content="text/javascript" />
   <meta http-equiv="content-style-type" content="text/css" />
   <!-- BEGIN switch_compat_meta -->
   <meta http-equiv="X-UA-Compatible" content="IE={switch_compat_meta.VERSION}" />
   <!-- END switch_compat_meta -->
   <!-- BEGIN switch_canonical_url -->
   <link rel="canonical" href="{switch_canonical_url.CANONICAL_URL}" />
   <!-- END switch_canonical_url -->
   {META_FAVICO}
   {META}
   {META_FB_LIKE}
   <meta name="title" content="{SITENAME_TITLE}{PAGE_TITLE}" />
   {T_HEAD_STYLESHEET}
   {CSS}
   <link rel="search" type="application/opensearchdescription+xml" href="/improvedsearch.xml" title="{SITENAME}" />
   <link rel="search" type="application/opensearchdescription+xml" href="{URL_BOARD_DIRECTORY}/search/improvedsearch.xml" title="{SEARCH_FORUMS}" />
   <script src="{JQUERY_PATH}" type="text/javascript"></script>
   <script src="{JS_DIR}{L_LANG}.js" type="text/javascript"></script>

   <!-- BEGIN switch_fb_login -->
   <script src="http://connect.facebook.net/{switch_fb_login.FB_LOCAL}/all.js" type="text/javascript"></script>
   <script src="{switch_fb_login.JS_FB_LOGIN}" type="text/javascript"></script>
   <!-- END switch_fb_login -->

   <!-- BEGIN switch_ticker -->
   <link type="text/css" rel="stylesheet" href="{JS_DIR}jquery/ticker/ticker.css" />
   <script src="{JS_DIR}jquery/ticker/ticker.js" type="text/javascript"></script>
   <!-- END switch_ticker -->

   <!-- BEGIN switch_ticker_new -->
   <script src="{JS_DIR}jquery/jcarousel/jquery.jcarousel.js" type="text/javascript"></script>
   <script type="text/javascript">//<![CDATA[
      /* Definir le sens de direction en fonction du panneau admin */
      var tickerDirParam = "{switch_ticker.DIRECTION}";
      var slid_vert = false;
      var auto_dir = 'next';
      var h_perso = parseInt({switch_ticker.HEIGHT});

      switch( tickerDirParam )
      {
         case 'top' :
            slid_vert = true;
            break;

         case 'left':
            break;

         case 'bottom':
            slid_vert = true;
            auto_dir = 'prev';
            break;

         case 'right':
            auto_dir = 'prev';
            break;

         default:
            slid_vert = true;
      }

      $(document).ready(function() {
         var w_cont = $('#fa_ticker_container').width();

         if (w_cont > 0)
         {
            $('#fa_ticker_container').width(w_cont);

            /* Affichage de la liste */
            $('#fa_ticker_content').css('display','block');

            /* Calcul des dimensions du conteneur et des elements */
            var width_max = $('ul#fa_ticker_content').width();
            var width_item = Math.floor(width_max / {switch_ticker.SIZE});
            var height_max = h_perso;

            /* Calcul de la hauteur maximale du conteneur en fonction des elements et de la hauteur personnalisee dans l'admin */
            $('ul#fa_ticker_content li').each( function () {
               if ($(this).height() > height_max)
               {
                  height_max = $(this).height();
               }
            } );

            /* Redimensionnement des elements et des images trop larges */
            $('ul#fa_ticker_content li').width(width_item).height(height_max).find('img').each(function () {
               if ($(this).width() > width_item)
               {
               var ratio      = $(this).width() / width_item;
               var new_height = Math.round($(this).height() / ratio);
               $(this).height(new_height).width(width_item);
               }
            });

            /* Redimensionnement et centrage du conteneur en mode vertical */
            if (slid_vert)
            {
               $('ul#fa_ticker_content').width(width_item).height(height_max).css('marginLeft','auto').css('marginRight','auto');
            }

            /* Initialisation du caroussel */
            $('#fa_ticker_content').jcarousel({
                  vertical: slid_vert,
               wrap: 'circular',
               auto: {switch_ticker.STOP_TIME},
               auto_direction: auto_dir,
            scroll: 1,
            size: {switch_ticker.SIZE},
            height_max: height_max,
            animation: {switch_ticker.SPEED}
            });
         }
         else
         {
            $('ul#fa_ticker_content li:not(:first)').css('display','none');
            $('ul#fa_ticker_content li:first').css('list-style','none').css('text-align','center');
         }
      });
   //]]>
   </script>
   <!-- END switch_ticker_new -->

   <script type="text/javascript">//<![CDATA[
   $(document).ready(function(){
      <!-- BEGIN switch_enable_pm_popup -->
         pm = window.open('{U_PRIVATEMSGS_POPUP}', '_faprivmsg', 'HEIGHT=225,resizable=yes,WIDTH=400');
         if(pm != null) { pm.focus(); }
      <!-- END switch_enable_pm_popup -->
      <!-- BEGIN switch_report_popup -->
         report = window.open('{switch_report_popup.U_REPORT_POPUP}', '_phpbbreport', 'HEIGHT={switch_report_popup.S_HEIGHT},resizable=yes,scrollbars=no,WIDTH={switch_report_popup.S_WIDTH}');
         if(report != null) { report.focus(); }
      <!-- END switch_report_popup -->
      <!-- BEGIN switch_ticker -->
         ticker_start({switch_ticker.HEIGHT}, {switch_ticker.SPACING}, {switch_ticker.SPEED}, '{switch_ticker.DIRECTION}', {switch_ticker.STOP_TIME});
      <!-- END switch_ticker -->
   });

   <!-- BEGIN switch_login_popup -->
      var logInPopUpLeft, logInPopUpTop, logInPopUpWidth = {LOGIN_POPUP_WIDTH}, logInPopUpHeight = {LOGIN_POPUP_HEIGHT}, logInBackgroundResize = true, logInBackgroundClass = false;
   <!-- END switch_login_popup -->

   <!-- BEGIN switch_login_popup -->
   $(document).ready( function() {
      $(window).resize(function() {
         var windowWidth = document.documentElement.clientWidth;
         var popupWidth = $("#login_popup").width();
         var mypopup = $("#login_popup");

         $("#login_popup").css({
         "left": windowWidth/2 - popupWidth/2
            });
      });
   });
   <!-- END switch_login_popup -->
   //]]>
   </script>
   {GREETING_POPUP}
   <!-- BEGIN switch_ticker_new -->
   <style>
   .jcarousel-skin-tango .jcarousel-item {
      text-align:center;
      width: 10px;
   }

   .jcarousel-skin-tango .jcarousel-item-horizontal {
      margin-right: {switch_ticker.SPACING}px;
   }

   .jcarousel-skin-tango .jcarousel-item-vertical {
      margin-bottom: {switch_ticker.SPACING}px;
   }
   </style>
   <!-- END switch_ticker_new -->
   {HOSTING_JS}
   <!-- BEGIN google_analytics_code -->
   <script type="text/javascript">
   //<![CDATA[
    var _gaq = _gaq || [];
    _gaq.push(['_setAccount', '{G_ANALYTICS_ID}']);
    _gaq.push(['_trackPageview']);
   _gaq.push(['_trackPageLoadTime']);

   <!-- BEGIN google_analytics_code_bis -->
   _gaq.push(['b._setAccount', '{G_ANALYTICS_ID_BIS}']);
   _gaq.push(['b._trackPageview']);
   <!-- END google_analytics_code_bis -->

    (function() {
      var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
      ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
      var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
    })();
   //]]>
   </script>
   <!-- END google_analytics_code -->
</head>
<body background="{T_BODY_BACKGROUND}" bgcolor="{T_BODY_BGCOLOR}" text="{T_BODY_TEXT}" link="{T_BODY_LINK}" vlink="{T_BODY_VLINK}">
   <!-- BEGIN hitskin_preview -->
   <div id="hitskin_preview" style="display: block;">
      <h1><img src="http://2img.net/i/fa/hitskin/hitskin_logo.png" alt="" /> Hit<em>skin</em>.com</h1>
      <div class="content">
         <p>
            {hitskin_preview.L_THEME_SITE_PREVIEW}
            <br />
            <span>{hitskin_preview.U_INSTALL_THEME}<a href="http://{hitskin_preview.U_RETURN_THEME}">{hitskin_preview.L_RETURN_THEME}</a></span>
         </p>
      </div>
   </div>
   <!-- END hitskin_preview -->

   <!-- BEGIN switch_login_popup -->
   <div id="login_popup">
      <table class="forumline" width="{LOGIN_POPUP_WIDTH}" height="{LOGIN_POPUP_HEIGHT}" border="0" cellspacing="1" cellpadding="0">
         <tr height="25">
            <td class="catLeft">
               <span class="genmed module-title">{SITENAME}</span>
            </td>
         </tr>
         <tr height="{LOGIN_POPUP_MSG_HEIGHT}">
            <td class="row1" align="left" valign="top">
               <div id="login_popup_buttons">
                  <form action="{S_LOGIN_ACTION}" method="get">
                     <input type="submit" class="mainoption" value="{L_LOGIN}" />
                     <input type="button" class="mainoption" value="{L_REGISTER}" onclick="parent.location='{U_REGISTER}';" />
                     <input id="login_popup_close" type="button" class="button" value="{L_DONT_DISPLAY_AGAIN}" />
                  </form>
               </div>
               <span class="genmed">{LOGIN_POPUP_MSG}</span>
            </td>
         </tr>
      </table>
   </div>
   <!-- END switch_login_popup -->

   <a name="top"></a>
   {JAVASCRIPT}

   <table class="bodylinewidth" width="{T_BODY_TABLE_WIDTH}" cellspacing="0" cellpadding="10" border="0" align="center">
      <tr>
         <td class="bodyline">
            <table width="100%" cellspacing="0" cellpadding="0" border="0">
               <tr>
                  <!-- BEGIN switch_logo_left -->
                  <td><a href="{U_INDEX}"><img src="{LOGO}" id="i_logo" border="0" alt="{L_INDEX}" vspace="1" /></a></td>
                  <!-- END switch_logo_left -->
                  <td align="center" width="100%" valign="middle">
                     <!-- BEGIN switch_logo_center -->
                     <a href="{U_INDEX}"><img src="{LOGO}" id="i_logo" border="0" alt="{L_INDEX}" vspace="1" /></a>
                     <br />
                     <!-- END switch_logo_center -->
                     <div class="maintitle">{MAIN_SITENAME}</div>
                     <br />
                     <span class="gen">{SITE_DESCRIPTION}<br />  </span>
                  </td>
                  <!-- BEGIN switch_logo_right -->
                  <td><a href="{U_INDEX}"><img src="{LOGO}" id="i_logo" border="0" alt="{L_INDEX}" vspace="1" /></a></td>
                  <!-- END switch_logo_right -->
               </tr>
            </table>

            <table cellspacing="0" cellpadding="0" border="0" align="{MENU_POSITION}">
               <tr>
                  <td align="{MENU_POSITION}"{MENU_NOWRAP}>{GENERATED_NAV_BAR}</td>
               </tr>
            </table>

            <div style="clear: both;"></div>

            <!-- BEGIN switch_ticker_new -->
            <div id="fa_ticker_block" style="margin-top:4px;margin-bottom:4px;">
               <table width="100%" border="0" cellspacing="0" cellpadding="0" class="forumline">
                  <tr>
                     <td align="left" class="row1">
                        <div id="fa_ticker_container">
                           <ul id="fa_ticker_content" class="jcarousel-skin-tango" style="display:none;">
                              <!-- BEGIN ticker_row -->
                              <li>{switch_ticker.ticker_row.ELEMENT}</li>
                              <!-- END ticker_row -->
                           </ul>
                        </div>
                     </td>
                  </tr>
               </table>
            </div>
            <!-- END switch_ticker_new -->

            <!-- BEGIN switch_ticker -->
            <div id="fa_ticker_block" style="margin-top:4px;margin-bottom:4px;">
               <table width="100%" border="0" cellspacing="0" cellpadding="0" class="forumline">
                  <tr>
                     <td align="left" class="row1">
                        <div id="fa_ticker_container">
                           <div id="fa_ticker" style="height:{switch_ticker.HEIGHT}px;">
                              <div class="fa_ticker_content">
                                 <!-- BEGIN ticker_row -->
                                 <div>{switch_ticker.ticker_row.ELEMENT}</div>
                                 <!-- END ticker_row -->
                              </div>
                           </div>
                        </div>
                     </td>
                  </tr>
               </table>
            </div>
            <!-- END switch_ticker -->

            <div id="page-body">
               <div id="{ID_CONTENT_CONTAINER}"{CLASS_CONTENT_CONTAINER}>
                  <table cellpadding="0" cellspacing="0" width="100%" class="three-col">
                     <tbody>
                        <tr>
                           <td valign="top" width="{C1SIZE}">
                              <div id="{ID_LEFT}">
                                 <!-- BEGIN giefmod_index1 -->
                                 {giefmod_index1.MODVAR}
                                    <!-- BEGIN saut -->
                                    <div style="height:{SPACE_ROW}px"></div>
                                    <!-- END saut -->
                                 <!-- END giefmod_index1 -->
                              </div>
                           </td>
                           <td valign="top" width="100%">
<!-- BEGIN html_validation -->
                           </td>
                        </tr>
                     </tbody>
                  </table>
               </div>
            </div>
         </td>
      </tr>
   </table>
</body>
</html>
<!-- END html_validation -->
kiarie

kiarie
****

Féminin
Messages : 281
Inscrit(e) le : 16/07/2004

http://www.life-in-ny.com
kiarie a été remercié(e) par l'auteur de ce sujet.
  • 0

Résolu Re: header en fond et couleur interieur du cadre de forum

Message par [Nihil] Lun 6 Jan 2014 - 18:51

Repère cette partie là

Code:
<table width="100%" cellspacing="0" cellpadding="0" border="0">
  <tr>
     <!-- BEGIN switch_logo_left -->
     <td><a href="{U_INDEX}"><img src="{LOGO}" id="i_logo" border="0" alt="{L_INDEX}" vspace="1" /></a></td>
     <!-- END switch_logo_left -->
     <td align="center" width="100%" valign="middle">
       <!-- BEGIN switch_logo_center -->
       <a href="{U_INDEX}"><img src="{LOGO}" id="i_logo" border="0" alt="{L_INDEX}" vspace="1" /></a>
       <br />
       <!-- END switch_logo_center -->
       <div class="maintitle">{MAIN_SITENAME}</div>
       <br />
       <span class="gen">{SITE_DESCRIPTION}<br />  </span>
     </td>
     <!-- BEGIN switch_logo_right -->
     <td><a href="{U_INDEX}"><img src="{LOGO}" id="i_logo" border="0" alt="{L_INDEX}" vspace="1" /></a></td>
     <!-- END switch_logo_right -->
  </tr>
</table>

Et déplace là juste au dessus de :
Code:
<table class="bodylinewidth" width="{T_BODY_TABLE_WIDTH}" cellspacing="0" cellpadding="10" border="0" align="center">

Normalement cela devrait être bon Wink
[Nihil]

[Nihil]
Membre habitué

Messages : 1215
Inscrit(e) le : 10/12/2009

https://forum.forumactif.com
[Nihil] a été remercié(e) par l'auteur de ce sujet.

Résolu Re: header en fond et couleur interieur du cadre de forum

Message par kiarie Lun 6 Jan 2014 - 19:26

ça marche!!! Merci je t'aime!! <3

par contre sais tu comment je pourrais arrondir le cadre? Dans mon css les cadres de forum sont déjà arrondi mais sa me change rien au cadre que l'on vient de mettre.
kiarie

kiarie
****

Féminin
Messages : 281
Inscrit(e) le : 16/07/2004

http://www.life-in-ny.com
kiarie a été remercié(e) par l'auteur de ce sujet.

Résolu Re: header en fond et couleur interieur du cadre de forum

Message par [Nihil] Lun 6 Jan 2014 - 20:22

Pour arrondir le cadre, il faut utiliser ce sélecteur là :
Code:
.bodyline {
/* Ton css ici */
}
[Nihil]

[Nihil]
Membre habitué

Messages : 1215
Inscrit(e) le : 10/12/2009

https://forum.forumactif.com
[Nihil] a été remercié(e) par l'auteur de ce sujet.

Résolu Re: header en fond et couleur interieur du cadre de forum

Message par kiarie Lun 6 Jan 2014 - 20:28

Heuu je ne dois pas faire les choses correctement car soit ça ne change rien soit ça m'annule tout mon css
kiarie

kiarie
****

Féminin
Messages : 281
Inscrit(e) le : 16/07/2004

http://www.life-in-ny.com
kiarie a été remercié(e) par l'auteur de ce sujet.

Résolu Re: header en fond et couleur interieur du cadre de forum

Message par [Nihil] Lun 6 Jan 2014 - 20:35

Peux tu me copier coller ce que tu as mis ^^ ?
[Nihil]

[Nihil]
Membre habitué

Messages : 1215
Inscrit(e) le : 10/12/2009

https://forum.forumactif.com
[Nihil] a été remercié(e) par l'auteur de ce sujet.

Résolu Re: header en fond et couleur interieur du cadre de forum

Message par kiarie Lun 6 Jan 2014 - 20:46

sa c'est la ou ça ne change rien

Code:
.bodyline {
.navig {
position: absolute;
left:0;
top: 0px;
width: 100%;
background-color: #DDC5CF;
border-top: 1px dotted #654C82;
border-bottom: 1px dotted #654C82;
}

a.mainmenu {
margin: 5px;
font-family: Coming Soon;
font-size: 12px;
text-shadow: 2px 2px 2px #FFFFFF;
}
}

et sinon j'ai essayé de mettre le .bodyline { tout en haut de mon css mais dans se cas ça annule tout le code.
kiarie

kiarie
****

Féminin
Messages : 281
Inscrit(e) le : 16/07/2004

http://www.life-in-ny.com
kiarie a été remercié(e) par l'auteur de ce sujet.

Résolu Re: header en fond et couleur interieur du cadre de forum

Message par [Nihil] Lun 6 Jan 2014 - 21:15

Ah ok tu n'as pas compris ce que je voulais dire Razz
Je voulais dire de mettre comme ça ^^
Code:
.bodyline {
   border-radius: 10px;
}

Donc ça donnerait :
Code:
.bodyline {
   border-radius: 10px;
}

.navig {
position: absolute;
left:0;
top: 0px;
width: 100%;
background-color: #DDC5CF;
border-top: 1px dotted #654C82;
border-bottom: 1px dotted #654C82;
}
 
a.mainmenu {
margin: 5px;
font-family: Coming Soon;
font-size: 12px;
text-shadow: 2px 2px 2px #FFFFFF;
}
[Nihil]

[Nihil]
Membre habitué

Messages : 1215
Inscrit(e) le : 10/12/2009

https://forum.forumactif.com
[Nihil] a été remercié(e) par l'auteur de ce sujet.

Résolu Re: header en fond et couleur interieur du cadre de forum

Message par kiarie Lun 6 Jan 2014 - 21:20

Je comprends vite quand on m'explique longtemps x)

Et ça marche merci beaucoup!!^^

Bon vu que tu semble experte et disposer a supporter mon ignorance j'aurais une dernière question x) Est il possible de mettre un contour a ce cadre et si oui comment?
kiarie

kiarie
****

Féminin
Messages : 281
Inscrit(e) le : 16/07/2004

http://www.life-in-ny.com
kiarie a été remercié(e) par l'auteur de ce sujet.

Résolu Re: header en fond et couleur interieur du cadre de forum

Message par [Nihil] Lun 6 Jan 2014 - 21:22

Alors il suffit d'ajouter une border Wink

Code:
.bodyline {
  border-radius: 10px;
  border: 1px solid black;
}
[Nihil]

[Nihil]
Membre habitué

Messages : 1215
Inscrit(e) le : 10/12/2009

https://forum.forumactif.com
[Nihil] a été remercié(e) par l'auteur de ce sujet.

Résolu Re: header en fond et couleur interieur du cadre de forum

Message par kiarie Lun 6 Jan 2014 - 21:25

Tu es vraiment un ange *.*

et il est possible de faire une double bordure comme sur le forum que j'ai montré dans mon 1er poste? x)
kiarie

kiarie
****

Féminin
Messages : 281
Inscrit(e) le : 16/07/2004

http://www.life-in-ny.com
kiarie a été remercié(e) par l'auteur de ce sujet.

Résolu Re: header en fond et couleur interieur du cadre de forum

Message par [Nihil] Lun 6 Jan 2014 - 21:41

Tu vas sur : http://css3generator.com/

Ensuite tu cliques sur Choose something > Box-shadow

Tu règles de telle manière à ce que cela donne comme une bordure (je t'ai mis une screen).

header en fond et couleur interieur du cadre de forum 1D1xH9T

Une fois que c'est fait, tu le rajoutes dans ton CSS pour .bodyline :
Code:
.bodyline {
   border-radius: 10px;
   border: 1px solid black;
   -webkit-box-shadow: 4px 0 0 0 #406B65;
   box-shadow: 4px 0 0 0 #406B65;
}

Cela va te rajouter un trait bleu sur la droite.

Si tu veux rajouter un trait sur la gauche par exemple tu mets une valeur négative à "Horizontal Length".
Ensuite tu copies la partie du code après les 2 points :
Code:
-webkit-box-shadow: -4px 0 0 0 #406B65;
box-shadow: -4px 0 0 0 #406B65;

Et tu la rajoutes derrière ce que tu as déjà en séparent par une virgule. Ca donne ça (c'est un peu compliqué à expliquer alors je te montre)

Code:
.bodyline {
   border-radius: 10px;
   border: 1px solid black;
   -webkit-box-shadow: 4px 0 0 0 #406B65, -4px 0 0 0 #406B65;
   box-shadow: 4px 0 0 0 #406B65, -4px 0 0 0 #406B65;
}

Si tu veux en rajouter en plus tu fais la même démarche, et tu fais comme moi tu sépares par des virgules ^^.
[Nihil]

[Nihil]
Membre habitué

Messages : 1215
Inscrit(e) le : 10/12/2009

https://forum.forumactif.com
[Nihil] a été remercié(e) par l'auteur de ce sujet.

Résolu Re: header en fond et couleur interieur du cadre de forum

Message par kiarie Lun 6 Jan 2014 - 21:56

Je n'arrive pas a faire des bordures de plusieurs couleur, quand je change les codes couleur sa me fait la bordure soit d'un coté ou de l'autre mais pas plusieurs superposé.

Mais bon c'est pas grave le résultat me convient assez bien^^

Merci beaucoup pour ta patience et pour info j'ai aussi utilisé ton explication pour supprimer les balises "Auteur" et "Massages" des sujets^^

Un grand merci!!!
kiarie

kiarie
****

Féminin
Messages : 281
Inscrit(e) le : 16/07/2004

http://www.life-in-ny.com
kiarie a été remercié(e) par l'auteur de ce sujet.

Voir le sujet précédent Voir le sujet suivant Revenir en haut

- Sujets similaires

Forum gratuit : Le forum des forums actifs :: Entraide & Support... :: Gérer l'apparence de son forum :: Archives des problèmes avec l'apparence du forum

Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum